I have a design that is almost working for me:
<!-- m --><a class="postlink" href="http://behan-law.com/buttons.php">http://behan-law.com/buttons.php</a><!-- m -->
However, in IE6 (at least) the nav buttons have the wrong height - but in Firefox 1.5, they look how I want them (See RED Bordered Buttons).
I have explicitly set the height to 54px, but IE seems to ignore this.
any ideas? anyone? I am fresh out.Overkill with the css:/* NAVIGATION BUTTONS */
#menu {
width: 100%;
height: 54px;
text-align: center;
background: url("buttons.php_files/menubar_blank_off.gif") repeat-x;
}
#menu-center {
width: 640px;
margin: 0 auto;
}
.cssnav{
white-space: nowrap;
width: 120px;
height: 54px;
float: left;
}
.cssnav a {
color: white;
font-size: 10pt;
display: block;
font-weight: bold;
text-decoration: none;
width: 120px;
padding-top:15px;
text-align: center;
}
.cssnav a:hover {
background: url("buttons.php_files/menubar_blank_on.gif") no-repeat;
color: yellow;
font-size: 10pt;
height: 30px;
font-weight: bold;
text-decoration: none;
}
* html a:hover {
visibility: visible;
}
/* END OF NAVIGATION */
and the html<!--MAIN NAVIGATION START-->
<div id="menu">
<div id="menu-center">
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/what.php" title="What We Do">What We Do</a></div>
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/who.php" title="Who We Are">Who We Are</a></div>
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/bio.php" title="Biography">Biography</a></div>
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/jobs.php" title="Careers">Careers</a></div>
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/contact.php" title="Contact Us">Contact Us</a></div>
</div>
</div>
<!--MAIN NAVIGATION END-->
Just change the image pathsCSS Rollover Buttons (<!-- m --><a class="postlink" href="http://www.search-this.com/website_design/css_rollover_buttons.aspx">http://www.search-this.com/website_desi ... ttons.aspx</a><!-- m -->)
and followed what it said, and I liked its reasons = SEO.
but, your solution worked like a charm
thanks so much!
<!-- m --><a class="postlink" href="http://behan-law.com/buttons.php">http://behan-law.com/buttons.php</a><!-- m -->
However, in IE6 (at least) the nav buttons have the wrong height - but in Firefox 1.5, they look how I want them (See RED Bordered Buttons).
I have explicitly set the height to 54px, but IE seems to ignore this.
any ideas? anyone? I am fresh out.Overkill with the css:/* NAVIGATION BUTTONS */
#menu {
width: 100%;
height: 54px;
text-align: center;
background: url("buttons.php_files/menubar_blank_off.gif") repeat-x;
}
#menu-center {
width: 640px;
margin: 0 auto;
}
.cssnav{
white-space: nowrap;
width: 120px;
height: 54px;
float: left;
}
.cssnav a {
color: white;
font-size: 10pt;
display: block;
font-weight: bold;
text-decoration: none;
width: 120px;
padding-top:15px;
text-align: center;
}
.cssnav a:hover {
background: url("buttons.php_files/menubar_blank_on.gif") no-repeat;
color: yellow;
font-size: 10pt;
height: 30px;
font-weight: bold;
text-decoration: none;
}
* html a:hover {
visibility: visible;
}
/* END OF NAVIGATION */
and the html<!--MAIN NAVIGATION START-->
<div id="menu">
<div id="menu-center">
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/what.php" title="What We Do">What We Do</a></div>
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/who.php" title="Who We Are">Who We Are</a></div>
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/bio.php" title="Biography">Biography</a></div>
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/jobs.php" title="Careers">Careers</a></div>
<div class="cssnav"><a href=http://www.webdeveloper.com/forum/archive/index.php/"http://behan-law.com/contact.php" title="Contact Us">Contact Us</a></div>
</div>
</div>
<!--MAIN NAVIGATION END-->
Just change the image pathsCSS Rollover Buttons (<!-- m --><a class="postlink" href="http://www.search-this.com/website_design/css_rollover_buttons.aspx">http://www.search-this.com/website_desi ... ttons.aspx</a><!-- m -->)
and followed what it said, and I liked its reasons = SEO.
but, your solution worked like a charm
thanks so much!