Log in

View Full Version : css problem



Moh
18-06-2008, 01:08 PM
I am currently having a problem with a navigation.
With 3 divs in a row
Left|Mid|Right

The only problem is, the right is merging with the mid, and the left isn't displaying at all (or could be behind the mid).

My full code is:

<html>
<head>
<style>
body {
background:#FFFFFF url('images/bg.gif') repeat-x fixed; margin-top:0px;
background-possision:top;
}
.container {
width:960px;
margin:auto;
}
.header {
background-image: url(images/bg.gif);
background-repeat: repeat-x;
height: 100px;
width:960px;
color:#6E97C5;
}
.nav_contain {
height:51px;
width:960px;
}
.nav_left {
float:left;
height:51px;
width:15px;
background-image: url(images/nav-left.gif);
background-repeat: no-repeat;
}
.nav_mid {
float:left;
height:51px;
width:930px;
color:#FFFFFF;
background-image: url(images/nav-mid.gif);
background-repeat: repeat-x;
}
.nav_right {
float:right;
height:51px;
width:15px;
background-image: url(images/nav-right.gif);
background-repeat: no-repeat;
}
.menu_item {
float: left;
position: relative;
padding-top:15px;
margin-right: 20px;
font-weight:bold;
}

</style>
</head>
<body>
<div class="container">
<div class="header"></div>
<div class="nav_contain">
<div class="nav_left"><div>
<div class="nav_mid">
<div class="menu_item">HOME</div>
<div class="menu_item">IMAGES</div>
<div class="menu_item">VIDEOS</div>
<div class="nav_right"><div>
</div>
</div>
</body>
</html>Thanks.

Excellent
18-06-2008, 01:20 PM
In your nav_container, just make that float left, anything under that remove float:left; from as they will just sit under that container.

kk.
18-06-2008, 01:24 PM
ok try changing the nav right to float: left and also, just ensure you have the correct image for the left one.

Moh
18-06-2008, 01:25 PM
In your nav_container, just make that float left, anything under that remove float:left; from as they will just sit under that container.
Didn't change anything.

Excellent
18-06-2008, 01:26 PM
Didn't change anything.Can you show us an image of whats what?

Moh
18-06-2008, 01:29 PM
This 1s in Tables
http://v-habbo.com/superfail/layout.htm

This 1s in divs
http://v-habbo.com/superfail/layout_div.htm

I want the divs to look like the tables one :(

kk.
18-06-2008, 01:29 PM
oh wait, you have left out a </div>...

put it after: "<div class="menu_item">VIDEOS</div>"

Excellent
18-06-2008, 01:33 PM
oh wait, you have left out a </div>...

put it after: "<div class="menu_item">VIDEOS</div>"Shows how I never check code doesn't it :P

Moh
18-06-2008, 01:35 PM
Shows how I never check code doesn't it :P
Ah yea.
I added a div, it shows the right now, but just in the wrong place.
Ill just have to fix that.
http://v-habbo.com/superfail/layout_div.htm

Edit: I just re-did the nav and it works now :P

Want to hide these adverts? Register an account for free!