...

View Full Version : Resolved CSS postioning



Josh404
11-09-2008, 01:19 AM
I am working on a site, using a modified .js menu system i found in a tutorial.

http://uoregon.edu/~josh/test_menu/
http://uoregon.edu/~josh/test_menu/style.css(the offending css is vertically spaced)

what i cannot work out is why the menu will not float left within the div it is contained within.

here is a firebug screengrab that shows the size of the containing div:
http://uoregon.edu/~josh/test_menu/firebug_screen.png

I think it is something to do with the order of <ul> & <li> elements in creating the menu. however as this is something preordained by the .js tutorial i got the menu code from I do not know what to do.

any advice greatly appreciated.

Josh404
11-09-2008, 01:55 AM
got an answer elsewhere. for those curious it was adding this to the css, which relates to the .js menu:

ul#treemenu1 {
float:left;
padding:0;
}

Rowsdower!
11-09-2008, 02:37 AM
NUTS! Just a little too late...

This also works (and fixes the problem of the top of the "News" link being cut off in my browser):



/* Main wrap */
#wrap {color:#000000; margin:10px auto; padding:0; width:750px;}
#header {margin:0;}
#slogan {color:#000000; font-size:1.5em; font-weight:700; letter-spacing:-1px; line-height:1.2em; margin:15px 0 20px 35px;}


.side {width:130px; float:left; }

.sidebar li{ /*Main items*/

font-size:22px;
font-weight:bold;
line-height:12px;
font-family:Arial,Helvetica,sans-serif;
text-transform:uppercase;
list-style:none;
margin: 7px 0 0px -15px;
padding: 0 0 0 0;
list-style-type: none;
}



See the before and after images below for the IE output from this change vs. your code...



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum