1 reply [Last post]
dvp
Offline
newbie
UK
Last seen: 10 years 3 weeks ago
UK
Timezone: GMT+1
Joined: 2009-11-02
Posts: 5
Points: 8

Puzzled
I'm trying out a 2-row horizontal menu without using tables. I'm working on a site for a friend, www.glanfyll-lewis.com, which currently uses table but i want to experiment using floats. The problem i am having is the second row of navigation, the client doesnt want a dropdown menu, i cant figure out a way to differentiate it from the top nav menu, as i want to move the second row nav menu to the middle and change menu colors and hover. Whatever i try, the second menu just doesnt seem to respond, what am i doing wrong?

HTML:

Glanfyll Lewis Digital Artist Gallery 1

Pink Towers
A Certain Brightness
Alien Landscape
Scarlet and Black

Fertile Ground
Floded Streets
Devotion
Marble Splendour

Homecoming
Rock Formation
Awaiting Judgement
Urban Spiral

Separation
View From Dark Room
Floaters
Halloween

CSS:

body {
text-align:center;
background: #fff;
}

#frame {
width:804px;
margin-right:auto;
margin-left:auto;
margin-top:10px;
padding:0px;
text-align:left;
background: #fff;
}

#contentleft {
width:1px;
padding:0px;
float:left;
background: #fff;
}

#contentcenter {
width:800px;
float:left;
background: #fff;
text-align: left;
font-size:12px;
color: #666600;
font-family: tahoma;
font-weight: normal;
margin: 30px 0px 0px -6px;
padding: 0px 20px 0px 0px;
}

#contentcentertwo {
width:500px;
padding:0px;
margin-left: -6px;
float:left;
background: #fff;
text-align: left;
font-size:12px;
color: #666600;
font-family: tahoma;
font-weight: normal;
}

#contentcenter a {float: left;
color: #000000}

#contentcenter ul {float: left}

#contentcenter a:hover {float: left;
color: #99cc00}

#contentheader {
background:#fff
}

#contentcenterright {
width: 200px;
float: right;
margin: 80px 0px 0px 0px;
}

p,pre {
margin:0px 0px 0px 10px;
font-size:14px;
color: #000000;
font-family: tahoma;
font-weight: normal;
}

p a{float: left;
color: #000000;
text-decoration: none;
}

p a:hover{float: left;
color: #666666}

h1 {
font-size:36px;
color: #666600;
font-family: tahoma;
font-weight: 100;
float:left;
clear: both;
margin: 10px 0px 10px 0px;
}

h2 {
font-size:16px;
color: #666666;
font-family: tahoma;
font-weight: 100;
float:left;
clear: both;
margin: -5px 0px 50px 1px;
}

ul {
font-family: Tahoma;
font-size: 14px;
margin: 0;
padding: 0;
list-style: none;
padding-top: 20px;
}
ul li {
display: block;
position: relative;
float: right;
}
li ul { display: none; }

ul li a {
display: block;
text-decoration: none;
color: #000000;
padding: 12px 0px 0px 25px;
background: #ffffff;
white-space: nowrap;
}
ul li a:hover { background: #ffffff; color:#ff6600}

li:hover ul {
display: block;
position: absolute;
background: #ffffff;
padding:0px;
}
li:hover li {
float: none;
font-size: 13px;
}
li:hover a { background: #ffffff; color:#666666;
}

#menutwo ul {
font-family: Tahoma;
font-size: 20px;
margin: 0;
padding: 0;
list-style: none;
padding-top: 20px

}
#menutwo ul li {
display: block;
position: relative;
float: right;
}

#menutwo li ul { display: none; }

#menutwo ul li a {
display: block;
text-decoration: none;
color: #000000;
padding: 12px 0px 0px 125px;
background: #666666;
white-space: nowrap;
}
#menutwo ul li a:hover { background: #666666; color:#ff6600}

#menutwo li:hover ul {
display: block;
position: absolute;
background: #ffffff;
padding:0px;
}
#menutwo li:hover li {
float: none;
font-size: 13px;
}
#menutwo li:hover a { background: #ffffff; color:#666666;
}

div.float {
float : left;
width : 175px;
padding : 8px;
border-width : 1px;
border-color : gray;
}
div.singular {
float : left;
padding-bottom : 10px;
border-color : gray;
border-width : 1px;
}

#footer {font-size:10px;
font-color: #c0c0c0;
font-family: tahoma;
font-weight: normal;
float: left;
margin-top:10px;}

#leftcolumn {
background: #fff;
width: 200px;
float: left;
padding:0px 15px 40px 0px;
}

#leftmiddle {
background: #fff;
width: 200px;
float: left;
padding:0px 17px 40px 0px;

}
#rightmiddle {
background: #fff;
width: 200px;
padding:0px 17px 40px 0px;
float: left;

}
#rightcolumn {
background: #fff;
width: 150px;
float: left;
padding:0px 0px 40px 0px;

}

Deuce
Deuce's picture
Offline
Guru
Somewhere, USA
Last seen: 3 years 3 weeks ago
Somewhere, USA
Timezone: GMT-5
Joined: 2005-11-20
Posts: 4424
Points: 1843

Please post a live link or

Please post a live link or use the provided code tags.

all ยป http://dictionary.reference.com/browse/all

Google isn't a bunch of guys reading and grading web sites, it's more like a bunch of monkeys sniffing food and putting the good bananas at the top. -Triumph