Hi,
I am trying to position a navigation menu relative the bottom of its
parent element. To be more explicit, I would like the bottom left
corner of the navigation menu to line up with the bottom left corner
of its parent element which is a top banner div. If the user's font
settings are larger or smaller than mine I would still like the menu
to line up at the bottom. Everything I've read, including w3c
statements on the attribute, would seem to indicate that this would
be very simple. But all I've been able to manage is to control how
the top of the nav menu element lines up with the bottom its parent
element, which means it is dependent on browser font settings. Below
is the code I am using. If anyone has any insight as to where I'm
going wrong I'd be very grateful.
Thanks,
Sean
---- xhtml -----
<div class="header"><!-- The header is before the 1st wrapper so that
it is separate from the columns -->
<div id="topnav">
<ul>
<li><a href="#">Home</a></li
><li><a href="#">Artists</a></li
><li><a href="#">Releases</a></li
><li><a href="#">Store</a></li
><li><a href="#">News</a></li
><li><a href="#">Info</a></li>
</ul>
</div>
</div>
<div class="subheader">
</div>
---- css ----
.header {
width: 100%;
height: 70px;;
padding: 0px 0;
background: url(/images/alien8_logo_new.gif) no-repeat #000;
background-position: 0 0;
}
.subheader {
width: 100%;
height: 20px;
min-height: 20px;
padding: 0px 0;
background: url(../images/alien8_logo_bottom.gif) no-repeat #CCCCCC;
background-position: 0 0;
}
#topnav {
margin: 0 0 0 0;
padding: 0;
background-color: pink;
height: 70px;
position: relative;
}
#topnav ul {
position: relative;
bottom: 0;
float: right;
}
#topnav ul li {
display: inline;
padding: 0;
margin: 0;
font-family:Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: bold;
color:#CCCCCC;
}
#topnav ul li a {
background-color: #333333;
padding: 2px 10px 2px 10px;
margin: 0;
text-align: center;
width: 9 em;
height: 20px;
color:#CCCCCC;
border-left: 1px solid #000;
}
#topnav ul li a:focus, #topnav ul li a:hover {
color: #003399;
background-color:#CCCCCC;
}
______________
ALIEN8 RECORDINGS
P.O. BOX 666, STATION R
MONTREAL, QC
CANADA, H2S 3L1
http://www.alien8recordings.com
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
