SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Guru SG1's Avatar
    Join Date
    Jul 2005
    Location
    Virginia, USA.
    Posts
    877
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    faux column won't appear in contentwrapper

    I'm trying to create a simple faux column on my site here with a blue sidebar. Unfortunately, it won't appear.

    What am I doing wrong? Thoughts are appreciated.

    This is what the code looks like;

    This is where the image is found.

    Code CSS:
    #contentwrapper {
        clear: both;
        background:    #FFF url(images/contentfaux.jpg) repeat-y scroll 0% 0pt;
        width: 900px;
        margin: 0;
        overflow: visible;
        }

  2. #2
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,108
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    Hello,

    I get the feelling you have used overflow: visible as your clearing mechanism. It needs to be something other than visible e.g. auto or hidden to do that

    Or you can add something else in there to clear the column - as the reason it's not showing is that the element doesn't have a height.

    Also, I would use background: #xxx url(xxx) repeat-y 0 0;

    Hope it helps

  3. #3
    SitePoint Guru SG1's Avatar
    Join Date
    Jul 2005
    Location
    Virginia, USA.
    Posts
    877
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes- your overflow: hidden recommendation was the proper solution. Thanks.

    Question: why use 0 0 instead of what I have, 0% 0 ?

    I did consider using a height requirement, but I fear that on some pages, the height would be too short and on other pages, the height would be too long. Correct?

    Quote Originally Posted by markbrown4 View Post
    Hello,

    I get the feelling you have used overflow: visible as your clearing mechanism. It needs to be something other than visible e.g. auto or hidden to do that

    Or you can add something else in there to clear the column - as the reason it's not showing is that the element doesn't have a height.

    Also, I would use background: #xxx url(xxx) repeat-y 0 0;

    Hope it helps

  4. #4
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,108
    Mentioned
    28 Post(s)
    Tagged
    2 Thread(s)
    I did consider using a height requirement, but I fear that on some pages, the height would be too short and on other pages, the height would be too long. Correct?
    Don't use a fixed height on the element.
    You can use min-height if you like, but the beauty of faux columns is that column doesn't need to be 100% high, it just needs to appear that way.
    THe background image is on a container wrapping all columns in the layout, so that the image will always reach the total height.

    Question: why use 0 0 instead of what I have, 0% 0 ?
    why use 0% 0

    I always keep the units the same in shorthand properties.


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
  •