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.

  1.  permalink
    The site is: Made Blue

    The Style Sheet is: CSS

    This issue is only in IE for the PC. Go figure right?

    The menu on the left is the issue. There is NOT supposed to be such a large padding on the left. When you roll over the item, it resets and looks correct. But obviously it is not supposed to be doing that.

    Any help would be MUCH appreciated.
  2.  permalink
    #left-nav li a { ... padding:. 5em; }


    ???
  3.  permalink
    Are you asking why I did that? Not sure what you are getting at. That works out to about 5px because of how I set the body font-size. Am I doing something wrong?
    •  
      CommentAuthornifkin
    • CommentTimeApr 6th 2006 edited
     permalink
    he might have been trying to point out the space between the decimal and the 5.

    In unrelated news (maybe it's intentional, but it doesn't look like it): the background-color of the body doesn't match the background image. ;)
  4.  permalink
    The background color is commented out.

    I took care of the spacing... That was wierd, because it was NOT in my code and I could not see it in BBEdit. I had to retype it. Server caching maybe.

    In any case, and ideas on the padding issue?
    •  
      CommentAuthormoondoggie
    • CommentTimeApr 13th 2006
     permalink
    Still looking through the code (not that I'll necessarily be able to help) and here's one thing I've noticed that might help steer the smart CSS people in the right way. From what I can tell, looking between Firefox and MSIE, you have two possibly separate problems:

    1) a:hover throws your links to the left.
    2) the left-nav boxes are too close to the left border.

    Now that I type it, it sounds exactly like what you're saying, but what I'm getting at is, when you hover, it doesn't put the links in the right place. When the page first loads in IE, the boxes are too close to the left, but the links look like they are where they should be. While everything looks correct after the hover, in reality it appears the whole box itself should be moved over a bit from the left side. In Firefox, these all have some space from the left border, in IE they don't.

    The a:hover thing also appears to be affecting the "This is Pure Blue" link in the middle of the page - maybe that'll make what I'm saying more clear. This makes it seem more like two separate issues.

    I'm still playing around with the code, but that doesn't necessarily mean I'll find an answer :) Hopefully my little bit of insight will help steer someone else into helping you soon.
    • CommentAuthortdrs
    • CommentTimeApr 13th 2006
     permalink
    ??? #left-nav li a {display:block; margin:0 0 .5em 0 !important; margin:0 0 .2em 0; background:#E0EDF5; border:1px solid #9AC3D8; padding:.5em; text-decoration:none;} ???

    i see two" margin:"

    i'm a bit rusty at the whole css thing... been a few years but i dont think you can have "color: clr1" and another "color: clr2" in the same css identifier... so why should two "margin:" be allowed?

    when a problem like this pops up i usually rem* out some of the formatting info until i figure out whats wrong... i suggest you do the same ;)
    • CommentAuthortdrs
    • CommentTimeApr 13th 2006
     permalink
    well there merwin... took another crack at it and there seems to be nothing wrong with it... but the header looks out of wack

    i built the page backwards from the left side navigation... nothing was out of the ordinary... once i got to the main header... the header sort of center aligned kinda straddled the left nav and main content...

    i left out the things not needed and finally cut and pasted the entire html in your formatting and the css in your foramtting instead... same deal... the main header still straddled... so i finally entered the DOCTYPE... i hate that stuff man

    but anyway POOOF!!! the bug appeared

    [header]
    [left blank][/left blank]
    [main header][/main header]
    [/header]

    [main content]
    [left nav][/left nav]
    [content n stuff][/content n stuff]
    [/main content]

    [that cool footer of yours]
    [/that cool footer of yours]

    dont bother with the padding or the margins at this moment of reformatting and redesign... just place the current info in those containers.. cuz the a hover will work with or without a left pad :D after the layout is down then you can spruce up the little details

    ...however it does look awesome in firefox

    p.s. it is always better to create your own code then to copy others... this way you learn from your mistakes instead of trying to figure out where the other guy made his or hers
Add your comments
    Username Password
  • Format comments as (Help)