SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    Sep 2006
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question HELP: background image alignment

    hello guys,

    im having a problem aligning background image at the bottom of my layout. it works on firefox and oprha, but it miz'up in IE. please... help. i would appreciate any info.

    tanx in advanced.

    bellow are the codes:

    HTML Code:
    <div id="vsotto">
      <div id="vsHeader">
        <!-- Header_vs -->
        <img src="images/vsotto_foliage_top_rit.png" alt="" width="930" height="125" /></div>
      <div id="vsContainer">
        <!-- Container_vs -->
        Yy - Lorem ipsum dolor sit amet Container
        <!-- -->
      </div>
      <div id="vsFooter">
        <!-- Footer_vs -->
        ZZ
        <!-- -->
      </div>
    </div>

    Code CSS:
    #vsotto {
    	width: 930px;
    	margin: 0 auto;
    	background: #575a5d url(images/vsotto_content_bgfx.png) no-repeat 0 bottom;
    	height: 600px;
     
    	}
     
    #vsHeader {
    	height: 200px;
    	background: url(images/vsotto_wood_matt.jpg) repeat-x left top;
    }

  2. #2
    SitePoint Zealot get_dave's Avatar
    Join Date
    Nov 2006
    Location
    England, UK
    Posts
    191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well that should work. Can you outline your problem a bit more please? Perhaps a link or at least a screen shot?
    I'm looking for a link exchange.
    contact me or head to:
    http://www.aheadcreative.co.uk

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,555
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    As mentioned above you will need to be more specific as the code above should work more or less as expected.

    One thing to note is that its not a good idea to mix keywords and literal values in the background properties (although it is now allowed).

    e.g.
    Code:
    no-repeat 0 bottom
    Some older browsers will trip up on that and not display the image so use one or the other.
    e.g.

    Code:
    no-repeat left bottom
    
    or
    
    no-repeat 0 100&#37;
    But other than that the above code should have rendered as you expected.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •