|
CSS - Ie6 Div Display Problem
I am having CSS DIV issues with IE6.
When dislayed in Firefox, IE7, IE8 it is fine, but my nice rounded boxes look like crap in IE6. I've attached a screen shot of the box as it looks in IE6 Code: <!-- CONTENT BEGIN --> <div id="box1" > <div id="lb" ><div id="rb"><div id="bb"><div id="blc"> <div id="brc"><div id="tb"><div id="tlc"><div id="trc"> <br /> <span class="style1" style="padding-left: 15px"><?php echo $Title; ?></span> <br /> <br /> </div> </div></div></div></div> </div></div></div></div> **the middle divs are all the corners for borders box1 css Code:
#box1 {
position: relative;
margin-left: 5px; margin-right: auto;
margin-top: 1em;
padding: 0;
text-align: left;
//width:100%; /* <-- use this to tie width to viewport size*/
width: 55em; /* <-- use this for a set width */
background-color: #eeeeee;;
}
Similar Tutorialsi have some tables done on my site with the display:none property. when you make a selection from the drop-down list, that table appears. my problem is that when page refreshes all object hide again. i use a javascript case statement to display the correct selection from the drop-down box. any ideas?? Code:
<!-- #Include virtual="/webcontent/doctype.txt" -->
<html>
<head>
<!-- #Include virtual="/tagsm.htm" -->
<!-- #Include virtual="/webcontent/cssinclude.htm" -->
<title>EPIC Performance</title>
<SCRIPT LANGUAGE="JavaScript" SRC="/webcontent/nav.js">
</SCRIPT>
</head>
<body>
<div class="wrapper">
<div class="lefthandnav">
<div class="headerimgleft">
EPIC LOGO
</div>
<div class="bl"><div class="br"><div class="tl"><div class="tr">
<a href="index.shtml">Home </a><br/>
<a href="login.asp">Log In </a><br/>
<a href="shopping.asp">Products</a><br/>
<a href="history.shtml">History</a><br/>
<a href="podcasts.shtml">Podcasts</a><br />
<a href="news.asp">News</a><br />
<a href="faq.asp">FAQ</a><br />
<a href="contact.shtm l">Contact Us</a><br/>
</div></div></div></div>
<div class="clear"> </div>
<div class="bl"><div class="br"><div class="tl"><div class="tr">
<b>Sponsors</b><br/><br/>
<p><img src="/images/PowerLift_logo.jpg"></p>
<p><img src="/images/Uesaka_logo.jpg"></p>
</div></div></div></div>
<div class="clear"> </div>
<div class="bl"><div class="br"><div class="tl"><div class="tr">
<b>EPIC Athletic Performance Inc.</b><br/>
P.O Box 61689<br/>
Colorado Springs, CO 80906<br/>
<b>epicindex.com</b>
</div></div></div></div>
<div class="clear"> </div>
</div>
<div class="righthandnav">
<hr class="topline"/>
<h2 class="headingtitle">Evaluate and Improve Athletic
Performance</h2>
<hr class="topline"/>
<div id="menu">
<dl>
<dt onmouseover="javascript:montre('smenu5');">Testing</dt>
<dd id="smenu5">
<ul>
<li><a href="#">Talent Identification</a></li>
<li><a href="#">Big 33</a></li>
<li><a href="#">Test Procedures</a></li>
<li><a href="#">Test Equipment</a></li>
<li><a href="#">Test Card</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu1');">Evaluation </dt>
<dd id="smenu1">
<ul>
<li><a href="#">Five Star Rating</a></li>
<li><a href="#">Vertical Jump Index</a></li>
<li><a href="#">Talent Identification Index</a></li>
<li><a href="#">Individual Index</a></li>
<li><a href="#">Multiple Test History</a></li>
<li><a href="#">Team Data</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu2');">Goals</dt>
<dd id="smenu2">
<ul>
<li><a href="#">Setting Goals</a></li>
<li><a href="#">Six Weeks</a></li>
<li><a href="#">High School</a></li>
<li><a href="#">College</a></li>
<li><a href="#">Pyramid Poster</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu3');">Program</dt>
<dd id="smenu3">
<ul>
<li><a href="#">Selecting a Program</a></li>
<li><a href="#">Strength Disk</a></li>
<li><a href="#">Books</a></li>
<li><a href="#">CD's</a></li>
<li><a href="#">Videos</a></li>
<li><a href="#">Posters</a></li>
<li><a href="#">Nutrition</a></li>
<li><a href="#">Make the Play Clinic</a></li>
<li><a href="#">Performance Speakers</a></li>
<li><a href="#">Program Equipment</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre('smenu4');">Equipment</dt>
<dd id="smenu4">
<ul>
<li><a href="#">Program Equipment</a></li>
<li><a href="#">Testing Equipment</a></li>
<li><a href="#">Clothing</a></li>
</ul>
</dd>
</dl>
</div>
</div>
</div>
</body>
</html>
the problem is when you look at the website in mozilla and IE I like the way it looks in mozilla but when you look in IE the top navigation is not aligning properly there is a problem with the HR tag here is the CSS code Code:
body
{
margin: 0;
padding: 0;
font-family: arial;
color: #000;
}
.wrapper {
width: 900px;
height:605px;
}
.lefthandnav
{
float: left;
width: 145px;
background-color:white;
padding:0px 5px 0px 0px;
}
.righthandnav
{
float: left;
width: 745px;
background-color:white;
padding: 0px 0px 0px 5px
}
.headerimgleft
{
height:75px;
}
.clearing
{
clear:both;
}
.headingtitle
{
font-weight: bold;
font-size: 15;
text-align:center;
}
.topline
{
margin: 0;
padding: 0;
width:94.3%;
margin:0px;
color: #CC0000;
background-color: #CC0000;
height: 5px;
}
.bl {background: url(bl.gif) 0 100% no-repeat #e68200;}
.br {background: url(br.gif) 100% 100% no-repeat}
.tl {background: url(tl.gif) 0 0 no-repeat}
.tr {background: url(tr.gif) 100% 0 no-repeat; text-align:center;padding:5px}
.clear {font-size: 1px; height: 1px}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
padding:5px 0px 0px 0px;
}
#menu dl {
float: left;
width: 8.7em;
margin: 0 1px;
}
#menu dt {
cursor: pointer;
text-align: left;
font-weight: bold;
background: #CC0000;
border: 1px solid gray;
}
#menu dd {
border: 1px solid gray;
}
#menu li {
text-align: left;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}
#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray;
}
a {text-decoration: none;
color: black;
color: #222;
}
any idea why its doing like that todd I have a small problem with the login bar on my homepage. In IE it decides to pad extra space on the bottom , however in Firefox all is displayed ok. Please visit www.wecook.co.uk to see the problem. I think the problem is this bit of css Code:
#login
{
width: 736px;
background-color: #e4e2df;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
border-top: 1px solid #000000;
padding-top: 1px;
padding-bottom: 1px;
text-align: right;
}
label:after
{
content: ": ";
}
label
{
color: black;
font-weight: bold;
padding: 1px;
text-transform: uppercase;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
}
input
{
display: block;
width: 100px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: xx-small;
padding: 4px;
border: solid black;
border-width: 1px 2px 2px 1px;
}
.buttonLogin
{
width: 60px;
color: black;
text-transform: uppercase;
border: 1px solid #5C5C5C;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
text-align:center;
}
Offending bit of HTML Code:
<!-- If no cookies display login bar -->
<!-- start login -->
<div id = "login">
<form action="Login.do" method="post">
<table width="736" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="445" align="right"> </td>
<td width="112" align="center">
<input name="uname" type="text" id="uname" value="Username" size = "10" /> <br />
</td>
<td width="112" align = "center">
<input name="pword" type="password" id="pword" value="Password" size = "10" /> <br />
</td>
<td width="67" align = "center" valign="bottom">
<input type="submit" name="Login" value="Login" class="buttonLogin" /> </td>
</tr>
</table>
</form>
<!-- end login -->
</div>
Any help is appreciated. Thanks. I think its to do with the login button - but dont know how to fix it. I have a page that seems to display well in most browsers except in IE 6 (and possibly below). The content that should appear in the right_sidebar is shifted to the bottom left of the page. Dreamweaver has shown a "three-pixel text jog" error. I have read several articles on the IE bugs especially the ones at positioneverything.com but I still can't solve my problem. This seems to be the suggested fix, but I apparently am not applying it correctly: Code: <!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
#column, #right_sidebar { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
I'm having some issues with website I'm putting together. Don't flame me for the code, it started as exported code from Photoshop. I need to get it up quick, after that, I'll convert it over to full CSS. http://www.foltzconstruction.com Try navigating to one of the subpages. Everything displays perfect in FF, but wrong in IE. Anyone got any clues as to why? I've attached my CSS file to make your life a little easier. Thanks, guys. Hi all. I got problem with display content in IE 6 and 7, It throws the content totally on left side, while in firefox its on center, like it should be. I think problem could be he #countrydivcontainer { text-align: left; margin-top: 0pt; margin-right: auto; margin-bottom: 0pt; margin-left: auto; width: 965px; color: #666666; clear: both; padding-top: 20px; padding-bottom: 5px; padding-left: 5px; padding-right: 5px; } Unfortunately i dont know how to explain the problem without the url to really see it Can someone help? Hi, I have this code and i need some text next to the drop down. I am attaching the image how it looks like the text " Hold Ctrl key 4 multiple " is next to the drop down and it sticks to the drop down i need some space between the text and drop down and its not working here is the css code The text scorlls next to the drop down and i want the space to be uniform on the 3 lines where the text scrolls down also can i have Hold Ctrl key 4 on one line and then multiple on the second line thank you princecharles Code:
.credfont
{
font-weight:bold;
font-size:12px;
padding:0px 0px 0px 4px;
color: #f00;
}
<tr class="oddrow">
<td class="lbl" width="152">Subjects: </td>
<td width="170"><span style="float:left;"><select name="Subjects" id="Subjects" multiple="multiple" size="2">
<option>Maths</option>
<option>Science</option>
<option>PT</option>
<option>Arts</option>
</select> </span> <span class="credfont">( Hold Ctrl key 4 multiple )</span>
</td>
<td class="lbl" width="92" > Class: </td>
<td colspan="2"> <input type="text" class="writein" name="class" id="class" size="30" value="">
</td>
</tr>
hello gurus i am having a problem with my autosfill script .. i am using pHP as a server side. while i am filling a text box i can see a available records froms the db. but it shows html elements are getting displayed over div box (records) i am attaching image so you will get exact idea. is there any css property available so that i can display this properly? Here's a 1st for me. Got a problem in Firefox NOT in IE Sometimes my floated div displays under div next to it, instead of beside it. If I refresh, then it always will display correctly next to it. Realized this was a much bigger problem when I tested in Firefox on another computer and half the pages did it first time they loaded. Within my div container I have my div menu floated left with a width of 20%, then my div maincontent also floats left with a width of 78%. (I've verified there is 5-10px extra space. So the two are not stretching the entire width) Tried floating the #maincontent right, but then my footer completely screwed up and couldn't fix. Not sure what kinda change I might need to make. Any insights? Anyone else encounter this in Firefox? Thanks, James Hi, In Firefox an odd behaviour occurs when changing the selection in a selectbox. Changing the value in the selectbox makes the footer to disappear. CTRL+F or refresh lets the footer appear again. This behaviour doesnt occur in IE6. Anyone familiar with this behaviour of Firefox and has a solution? The page can be found at: http://users.castel.nl/~kampm01/test/select.html with regards, Marc Hi, My site is loading fine in IE but messing up in FF, the tables (yes tables, sry) are loosing all height and widths. Ive had a look about but cant work out how to fix/get around this. HTML Code: <div id="products"> <table border="0" cellpadding="0" cellspacing="0" bgcolor="#ED1C24" style="width:194px; height:114px; margin-right:5px;margin-bottom:5px;"> <tr> <td align="left" class="code" style="padding-left:3px;"> AKA </td> <td align="right" class="name" style="padding-right:3px;"> TITLE </td> </tr> <tr> <td colspan="2" align="center" valign="middle" style="background-image: url(images/item_bg.gif); background-repeat:no-repeat;"> <a href="details.php?id=CODE"> <img src="images/products/photos/CODE.jpg" alt="TITLE" border="0" style="height:84px; width:184;" /></a> </td> </tr> </table> </div> CSS Code: #products { padding-bottom:10px; line-height:20px; font-family:Arial, Helvetica, sans-serif; font-size:11px; letter-spacing:1px; display:inline-table; vertical-align:top;}
#products table {display: inline}
How can i get the same effect so FF looks the same as IE? Thanks for any help. Mike well i have totally redesigned my orginal page due to problems with IE browser-- i am now using a two column template and have copied code exactly-- had both XHTML and CSS verified with the W3C validator and they both check out to be ok-- the page is NOT showing up properly at all-- i am using FIREFOX as browser and i am wondering if i have now traded one problem for another i would sure appreciate it if someone would just go and look at page to see if it shows up right in another browser- THE PAGE also here is the url for the CSS CODE here is link to how page is supposed to look-- CORRECT VIEW if the page is not right in FOX does anyone know a work around to make it right?????? UGH UGH THIS IS SO FRUSTRATING thanks in advance-- Hola, I'm trying to add a menu I got from CSSplay to my site. It's displaying dot in the upper right of each li space in FF, but it's fine in IE. The original file is fine, of course, Anyone ever had this problem? brizfoto dot com slash test I've been trying to scrap togther a website and I have buttons that when you rollover them a menu appears for it. It looks fine in IE but when i display it in mozilla it all goes to hell. Here is the link: http://bingweb.binghamton.edu/~theta/nu05/new/code1.html Thanks for the help -Stooge Code: a {
display:blocks;
width:100px;
height:20px;
border:1px solid #000000;
background:#CCCCCC;
}
This code works great in Internet Explorer, but Firefox doesn't seem to like the width and height settings. Does anyone know a way to do this in firefox? Thanks in advance! I'm posting this in CSS because I think it can be solved with a CSS change, but any other ideas are welcome. See: www [dot] bluesheepstudios [dot] com [slash] ChrisCo [slash] logos.html CSS is at: www [dot] bluesheepstudios [dot] com [slash] ChrisCo [slash] stylesheet.css (sorry, can't post links) It displays properly in FF, but in IE6 and 7 the "portfolio" and "before and after" box headings are not displaying. I'm using lightbox.js to display full size images when a user clicks on a thumbnail image in the right column. The problem is caused by the thumbnail image/links and/or the lightbox.js. When I remove the links, the box headings display as they should. Any ideas what would cause this and how to fix? Thanks. Here's the page: http://www.javashack.net/hatj/2yrolds2.html Now, the black border around the center content area is inconsistent on IE only. On the other 3 browsers, it shows properly. When viewed on IE, the border (of the content area) has breaks in it as soon as you try to scroll up and down the page. Also, as I add more divs in the content area (#horsebox), the border changes from being at a margin-left of 190px, to having a margin-left of 0px. The content stays where it is supposed to be. I can't really figure out why, but I'm sure it has something to do with my use of the .clearfix. I'm still tinkering with it to try to figure it out, but I'd appreciate any help along! TIA Javashackgirl Hi, I am having problems with the layout in IE and Mozilla Whats happening is i have a 3 colummn layout but i dont see the footer in both browsers Second problem is the right hand div i want it to extend till the bottom of the footer white is the background color for the right hand nav Normally the right hand will have more text content then the left hand div will have Third problem is in IE there is a huge gap between the top horizontal nav after contact me button and the gap is smaller in Mozilla Fourth problem is the left hand nav width problem in mozilla in IE it aligns right at the end of the Selling tab. In mozilla its little bit less them the selling tab Can someone tell me what i am doing wrong Code:
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<title>Realtor.</title>
<link href='style1.css' type='text/css' rel='stylesheet' />
<style type="text/css">
#dlmenu {height:10em;}
#menu {list-style-type:none; margin:0 0 10px; padding:0; position:absolute; width:183px; background:#B0C4DE; z-index:100;}
#menu li {display:block; padding:0; margin:0; position:relative; z-index:100;}
#menu li a, #menu li a:visited {display:block; text-decoration:none;}
#menu li dd {display:none;}
#menu li:hover, #menu li a:hover {border:0;}
#menu li:hover dt a , #menu li a:hover dt a {background:#1874CD center center; color:black; }
#menu li:hover dd, #menu li a:hover dd {display:block;}
#menu li:hover dl, #menu li a:hover dl {background:#1874CD;}
#menu table {border-collapse:collapse; padding:0; margin:-4px;}
#menu dl {width: 183px; margin: 0; background: #B0C4DE; cursor:pointer;}
#menu dt {margin:0; padding: 0; border-top:1px solid #cce;}
#menu dd {margin:0; padding:0; text-align:left; }
.gallery dt a, .gallery dt a:visited {display:block; color:#fff; padding:5px 5px 5px 10px; background: #007FFF center center;}
.gallery dd a, .gallery dd a:visited {color:#000; min-height:1em; text-decoration:none; display:block; padding:4px 5px 4px 20px; background: #1874CD;}
* html .gallery dd a, * html .gallery dd a:visited {height:1em;}
.gallery dd a:hover {background:black; color:#1874CD;}
</style>
</head>
<body style="background:#B0C4DE;">
<div class="page_wrapper">
<div class="page_header"></div>
<div class="menu_bar">
<div id="tabsJ">
<ul>
<li><a href="default.aspx" title="Home"><span>Home</span></a></li>
<li><a href="buying.aspx" title="Buying"><span>Buying</span></a></li>
<li><a href="selling.aspx" title="Selling"><span>Selling</span></a></li>
<li><a href="relocation.aspx" title="Relocation"><span>Relocation</span></a></li>
<li><a href="searchmls.aspx" title="Search MLS"><span>Search MLS</span></a></li>
<li><a href="localinfo.aspx" title="Local Info"><span>Local Info</span></a></li>
<li><a href="vma.aspx" title="Virtual Market Analysis"><span>Virtual Market Analysis</span></a></li>
<li><a href="calculator.aspx" title="Calculator"><span>Calculator</span></a></li>
<li><a href="contact.aspx" title="Contact Me"><span>Contact Me</span></a></li>
</ul>
</div>
</div>
<div style="clear:both;"></div>
<div class="lefthandmenu">
<div id="dlmenu">
<ul id="menu">
<li>
<dl class="gallery">
<dt><a href="mortgagecal.asp" title="Mortgage Calculator">Mortgage Calculator</a></dt>
</dl>
</li>
<li>
<dl class="gallery">
<dt><a href="loanamorcal.asp" title="Loan Amortization Calculator">Loan Amortization Calculator</a></dt>
</dl>
</li>
<li>
<dl class="gallery">
<dt><a href="loancal.asp" title="Loan Calculator">Loan Calculator</a></dt>
</dl>
</li>
<li>
<dl class="gallery">
<dt><a href="loancal.asp" title="Loan Calculator">Rent vs Buy Calculator</a></dt>
</dl>
</li>
<li>
<dl class="gallery">
<dt>
<a href="mailto:ssss@sssssssss.com">
<b><font color="black">Ssssss Ddddddd<br/>
<i>Broker Associate</i><br/>
<font size="2em">RRRRRR 11 Rrrr ReeeeeRealty<br/>
3212 North 12th St.<br/>
New England, DE 111111<br/>
213-234-1234<br/>
ssss@sssssssss.com</font></b></font></a>
</dt>
</dl>
</li>
</ul>
</div>
</div>
<div class="righthandmenu">
<h4>Calculators</h4>
<p>A mortgage calculator for every need
Whether you're buying a home or refinancing an existing loan, we have a mortgage calculator that can help you make the right decisions. Determine exactly which deal offers the lowest monthly payments, how much home you can afford, and whether it makes sense to rent or buy.</p>
</div>
<div style="clear:both;"></div>
<div class="footer">
heelo</div>
</div>
</body>
</html>
Code:
body {
text-align: center;
background-color: #D5D0B0;
margin-bottom:10px;
color:black;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
.page_wrapper {
margin-left: auto;
margin-right: auto;
width:799px;
text-align: left;
background: #FFFFFF url('../img/content_bg.gif') top left repeat-y;
}
.page_header {
height: 198px;
background: #FFFFFF url('../images/banner.jpg') bottom left no-repeat;
clear: both;
}
.menu_bar {
margin:0px;
padding:0px;
clear:both;
}
#tabsJ {
float:left;
width:100%;
background:#F4F4F4;
font-size:93%;
line-height:normal;
}
#tabsJ ul {
margin:0;
padding:5px 0px 0px 0px;
list-style:none;
}
#tabsJ li {
display:inline;
margin:0;
padding:0;
}
#tabsJ a {
float:left;
background:url("tableftJ.gif") no-repeat left top;
margin:0;
padding:0 0 0 5px;
text-decoration:none;
}
#tabsJ a span {
float:left;
display:block;
background:url("tabrightJ.gif") no-repeat right top;
padding:5px 9.4px 5px 9.41px;
color:#24618E;
}
#tabsJ a span {float:none;}
#tabsJ a:hover span {
color:#FFF;
}
#tabsJ a:hover {
background-position:0% -42px;
}
#tabsJ a:hover span {
background-position:100% -42px;
}
.lefthanddiv
{
width:799px;
margin:15px 10px 15px 10px;
}
h2 {
color:#000000;
font-family: Arial, Helvetica, Geneva, sans-serif;
font-size: 125%;
font-weight: bold;
margin: 10px 0 0 0;
padding:15px 0px 0px 0px;
color:red;
}
ul {
list-style-type: square;
}
h5 {
color:#000000;
font-family: Arial, Helvetica, Geneva, sans-serif;
font-size: 100%;
font-weight: bold;
margin: 5px 0 0 0;
padding:5px 0px 0px 0px;
color:red;
}
.paraclass
{
padding: 1px 25px 3px 0px;
}
.container
{
width:879px;
background:#1C86EE;
}
.lefthandmenu
{
float:left;
width:200px;
padding:1px 0px 0px 0px;
}
.righthandmenu
{
float:left;
width:579px;
padding:1px 10px 10px 10px;
}
#menu1 {
width: 187px;
}
#menu1 li a {
height: 32px;
voice-family: "\"}\"";
voice-family: inherit;
height: 24px;
text-decoration: none;
}
#menu1 li a:link, #menu1 li a:visited {
color: #E4D6CD;
display: block;
background: url(menu1.gif);
padding: 6px 0 0 8px;
}
#menu1 li a:hover {
color: #FFF;
background: url(menu1.gif) 0 -32px;
padding: 6px 0 0 8px;
}
.newul {
list-style: none;
margin: 0;
padding: 0;
}
h4 {
color:#000000;
font-family: Arial, Helvetica, Geneva, sans-serif;
font-size: 125%;
font-weight: bold;
margin: 3px 0 0 0;
padding:3px 0px 0px 0px;
color:red;
}
.sig
{
padding:5px 5px 5px 5px;
font-size:75%;
}
#footer {
width: 879px;
margin: 0 auto;
background: #ffc;
border: 1px solid #000;
}
thank you so much for all your help I am attaching the pictures as they look in both browsers the website http://www.mostardesigns.com/4five1/ the top menu links work ok in firefox but in IE they wont display, here is my css code for the links: Code:
a.a_bannerLink:link, a.a_bannerLink:visited, a.a_bannerLink:active {
color:#FFFFFF;
text-decoration:none;
font-size:12px;
font-weight:bold;
padding:6px 15px 6px 15px;
display:block;
}
a.a_bannerLink:hover {
color:#FFFFFF;
text-decoration:none;
font-size:12px;
padding:6px 15px 6px 15px;
background-image:url(../images/link_bg.jpg);
background-repeat:repeat-x;
display:block;
}
any help is appreciated, thanks in advance. the page is http://www.mostardesigns.com/fmrehabv2/ as you can see in FF it shows up right but in IE the little menu splitters on the left menu are like 10px high instead of 2px for some reason, help! thanks in advance. |
|||||||