#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    May 2004
    Posts
    1
    Rep Power
    0

    Css trouble, relative dive pushes menu down


    I am having problems with my xhtml (css here). As you can see, the frog is pushing the menu (vert1 in the css) down. I am also told that the news (vert2) is being pushed down in IE6...can anyone help?
  2. #2
  3. nx
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2003
    Location
    USA
    Posts
    626
    Rep Power
    0
    ok..well..your problems lie in just a few places:
    1) use absolute positioning with #frog to make it so it doesnt push down the menu
    2) trying using more % or em values as apposed to pixel values so your site will look virtually the same on smaller or larger screen resolutions

    also, if youre going for standards in xhtml and css...go ahead and replace font-family and font-size with just font:
    but thats just optional

    terminal
  4. #3
  5. This tagline is not long enoug
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2003
    Location
    Toronto, ON Canada! I AM CANADIAN
    Posts
    863
    Rep Power
    16
  6. #4
  7. Thanks Johnny Hart (BC) R.I.P.

    Join Date
    May 2003
    Location
    Dallas
    Posts
    5,268
    Rep Power
    1956
    Code:
    <div style="position: relative; z-index: 100; top: 0px; left: -98px;"><div id="frog"></div></div>
    The relative positioned div is occupying the space you want for #vert1. A reletive positioned element is shifted, but its original space is not vacated. Quite correctly, the float drops down clear of the obstruction.

    cheers,

    gary

    ps. Great visual effect.
    There are those who manage to build a web site without knowing what they're doing; thereby proving to themselves they do, indeed, know what they're doing.

    My html and css workshop, demos and tutorials.
    Ask a better question, get a better answer.

IMN logo majestic logo threadwatch logo seochat tools logo