Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

    • CommentAuthorsquawk
    • CommentTimeSep 14th 2007 edited
     permalink
    EDIT: This is solved, scroll down for more browser problem goodness.

    Hi all,
    I am busy remodeling my own site and just started coding. For one reason or another my list items in the list 'fresh & juicy from the portfolio' don't want to accept my bottom padding, no matter how hard I try. If you want to see what I am talking about check out …

    .home #fresh_portfolio { margin: 2.3em 0 0 0; }
    .home #fresh_portfolio ul { margin: 2.5em 0 0 0; }
    .home #fresh_portfolio ul li h4 { padding:0 2.3px 0 392.3px; }
    .home #fresh_portfolio ul li p { padding:0.5em 2.2px 0 392.2px; font-size:1.35em; font-weight:bold; line-height:1.15em; color:#4a3f2c; font-family:'Lucida Sans', 'Lucida Grande', 'Trebuchet MS', Helvetica, Verdana, Arial, sans-serif; }
    .home #fresh_portfolio ul li p.date { padding:0 0.3em 0 393px; font-size:1em; line-height:0.5em; text-transform: uppercase; color:#105496; }
    .home #fresh_portfolio ul li img { float:left; margin:-3.7em 0 0 3px; width:381px; height:94px; background:#333; }
    .home #fresh_portfolio ul li.first img { height:187px; }
    .home #fresh portfolio ul li { padding:0 0 2.55em 0; } THIS BIT DOESN'T WANT TO OBEY;-)
    • CommentAuthorverb
    • CommentTimeSep 14th 2007 edited
     permalink

    It seems you made a little typo. "fresh portfolio ul li" instead of "fresh_portfolio ul li". Once you change that it'll work.

    Thankful People: squawk
    • CommentAuthorsquawk
    • CommentTimeSep 14th 2007
     permalink
    You cannot be serious... I tried almost everything and in the end it is a bloody typo? Thanks a lot Maarten..
    • CommentAuthorsquawk
    • CommentTimeSep 14th 2007
     permalink
    Hi again;-) I (actually it was maarten) solved my previous problem with the padding, but now I have another one: I used the html tag to hold a background image and shifted the body down using margin-top in order to see it. For one reason or another (I've said that before, right?) there is one big white stripe at the bottom of the document as if there were a bottom margin as well. (There isn't)
    Since it's been a long day, I am probably missing something. Can anyone point out to me how to get rid of that white stripe at the bottom.
    Thanks....

    P.S.: The URLs are still the same.
    • CommentAuthorsquawk
    • CommentTimeSep 14th 2007
     permalink
    I think I might actually have a bigger problem:

    firefox (on xp and osx) completely ignores my sifr instructions....
    both ie6 on xp and ie7 on vista show me only the first 20px of my site at the top. After that there is one big vast emptyness...

    Oh, and safari still has that white stripe at the bottom.

    Is my code really that bad, or did I just get lucky again?
    • CommentAuthorverb
    • CommentTimeSep 14th 2007 edited
     permalink

    I see some weird things when looking at your CSS file. For example:

    • padding:0 1.76px 1.5em 1.76px; (1.76 pixels? that doesn't exist)
    • background: url('images/bg.jpg') #f1efed center top repeat-y; (the background color has to be placed before the background image)

    I recommend looking through all the code for this kind of 'mistakes' and correcting them, maybe it will solve some issues. As for the 'emptyness' in IE, that's just really weird. I can't see it right now, because I'm on a Mac, but it sounds like some container element needs an overflow:hidden or something like that. (I'm not sure, though)

    The white bar at the bottom of the page can be removed by deleting this part (I've been playing around with the 'edit css' function of the Firefox web developer extension for a bit):

    html { background:url('images/ruler.jpg') repeat-x; }
    

    Over here, the sifr elements are working fine in Firefox (2.0.0.6), by the way…

    • CommentAuthorljromanoff
    • CommentTimeSep 14th 2007
     permalink
    "(the background color has to be placed before the background image)"

    No, it doesn't. The W3C implies an order for shorthand properties, but doesn't adhere to them in their own examples. And I have never had a problem with the background color property declared after the background image.
    • CommentAuthorsquawk
    • CommentTimeSep 15th 2007 edited
     permalink
    Thanks for the replies; I fixed things with the white bar by introducing another container element. Apparently they don't like it when you use background images on the html element.
    As for SIFR and Firefox: Yes it works, but I am pretty sure that this is not my font it is rendering. It is supposed to be Geoslab 703... The serifs look a lot like old refrigerators.

    And about ie... I got the background showing up, but that's about it.
    • CommentAuthorsquawk
    • CommentTimeSep 15th 2007
     permalink
    The problem with IE doesn't seem to be related to my stylesheet. When I comment out the link, nothing shows up in IE, even though the source code has loaded. So its somewhere in the HTML and not in the CSS.
    • CommentAuthorsquawk
    • CommentTimeSep 15th 2007 edited
     permalink
    Ok, guys, turns out that IE didn't like this:

    <script src="sifr.js" type="text/javascript" />
    had to be:

    <script src="sifr.js" type="text/javascript"></script>

    I still have the SIFR problem though... Doesn't work in firefox.
    • CommentAuthorljromanoff
    • CommentTimeSep 17th 2007
     permalink
    Is this site available for us to view?
    • CommentAuthorsquawk
    • CommentTimeSep 18th 2007 edited
     permalink
    All fixed… Thanks…
Add your comments
    Username Password
  • Format comments as (Help)