heya all, ok im making a E-portfolio, and there is loads of links, so i decided to make a mini navigation to the left, and float the "template" to the right. in EI, it is kinder messing up, in firefox etc, it looks good when the screen is maximised, but when its not it pops up top.

here is a link to site: http://www.karmaguild.net/hound/home.htm

the .css is http://www.karmaguild.net/hound/style.css

ty

Im not really sure what it is you want to do, but i would say to start with take all those layout elements that only appear once in the page and changed them to #id's instead of .classes, try to save the classes for inline elements and those which might appear several times on the same page.

I think if you created a centralised main container with the two div's (nav & holder) oppositely floated to the left and right with width properties on each you should get what it is you are looking for. at the moment your 'holder' div is collapsed because they have not been floated properly.

Then how do you Float "Properly"?

It's not really a matter of 'proper', you've done nothing wrong, per se.

What you DO have in IE is a problem with the doubled-float margin bug :

.nav {
float:left;
margin: 50px 0px 0px 150px;
padding: 3px 3px 3px 3px;
background-color: #3c3f3a;
border-left-width: thick;
border-left-style: solid;
border-left-color: #212321;
}

This bug crops up when you float: left and then add a left margin (or float right w/right margin) - IE will DOUBLE the margin width. So, in IE, your 150px left margin turns into 300 !!!
You can read more about the bug here.. including the solution:
http://www.positioniseverything.net/...ed-margin.html
You're going to have to get used to using conditional comments and at least 2 css files, 1 for everything else, and 1 for the bug fixes for IE 6 and below.

The solution to this bug is to put display:inline in the rules for #nav - and put it in a new css file JUST for ie fixes.

I would also suggest, as Beta did, that you wrap the WHOLE layout in a #container div with a position:relative property.