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 Code:

<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

eft; 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

Originally Posted by Excellent

In your nav_container, just make that float left, anything under that remove float

eft; from as they will just sit under that container.

Didn't change anything.

~~Excellent~~ · 18-06-2008, 01:26 PM

Originally Posted by Jack120

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

Originally Posted by kk.

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

~~Moh~~ · 18-06-2008, 01:35 PM

Originally Posted by Excellent

Shows how I never check code doesn't it

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

Thread: css problem

Thread Tools

css problem

Posting Permissions