dkim18
asked on
Link underline behavior issue in same version of IE
Hi Experts,
I am having a weird link underline behavior in same version of IE.
I am testing web based app and a underline in footer on a login page act differently between same version of IE.(one in intranet and another one is in my machine that is connected via VPN.)
From the below code, there is no underline for the first "Contact Us" link (IE 8) in company's work station. (the second "Contact" underline works fine everywhere.) However, everything is fine (also IE 8) in my laptop that is connected via VPN. I tried to manipulate css file, but wasn't successful.
I checked another co-worker's IE (within intranet) and it's also showing same issue.
I cleared cache in IE, but didn't help.
My question is why the "Contact Us" underline(the first one) is working in my laptop with same version of IE, but is not working in company's IE browser.
Any ideas?
I am having a weird link underline behavior in same version of IE.
I am testing web based app and a underline in footer on a login page act differently between same version of IE.(one in intranet and another one is in my machine that is connected via VPN.)
From the below code, there is no underline for the first "Contact Us" link (IE 8) in company's work station. (the second "Contact" underline works fine everywhere.) However, everything is fine (also IE 8) in my laptop that is connected via VPN. I tried to manipulate css file, but wasn't successful.
I checked another co-worker's IE (within intranet) and it's also showing same issue.
I cleared cache in IE, but didn't help.
My question is why the "Contact Us" underline(the first one) is working in my laptop with same version of IE, but is not working in company's IE browser.
Any ideas?
<div id="foot">
<a href="http://www.xxx.org/" rel="external" title="xxx"><img src="./images/xxx.png" alt="xxx" /></a>
<ul><li>
<a href="mailto:xxx@xxx.org" title="Send an Email">Contact Us</a></li>
<li>xxx</li>
<li>xxx</li><li>xx, xx 7777</li>
<li>xxx-xx-xxxx</li>
</ul>
<a href="http://www.xxx.org/" rel="external" title="xxx"><img src="./images/xxx.png" width="200" height="18" alt="xxx" /></a>
<ul><li>
<a href="mailto:xxx@xxx.org" title="Send an Email">Contact Us</a></li>
<li> xxx</li>
<li>xxx Ave.</li><li>City, xx 88888</li>
<li>xxx-xx-xxxx</li><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
</ul>
</div>
/////////////////////////////////// css file /////////////////
/* *****************
FOOTER
***************** */
#foot {
clear: both;
height: 110px;
background: url(./css_images/gradient05.png) 0 0;
z-index: 50;
overflow: hidden;
}
#foot img {
margin: 10px 10px -20px 20px;
}
#foot ul {
position: relative;
top: -2px;
display: block;
width: 760px;
height: 10px;/* spacing between KKI address and OIF address*/
margin-left: 190px;
font-size: 12px
}
#foot ul li {
display: inline;
margin: 4px;
}
#foot ul li:first-child {
margin-left: 0;
}
#foot a {
color: black
}
ASKER
BTW, in other web browsers(FF, Chome, Safari) things work just fine.
have you tried setting it explicitly:
#foot a{
text-decoration:underline;
}
or if you don't want the underline...
#foot a{
text-decoration:none;
}
#foot a{
text-decoration:underline;
}
or if you don't want the underline...
#foot a{
text-decoration:none;
}
ASKER
kozaiwaniec,
I did, but didn't work. Of course, IE in my laptop works fine with/without it.
I did, but didn't work. Of course, IE in my laptop works fine with/without it.
ASKER
FYI, I already rebuilt/cleaned restarted tomcat server, but didn't help.
you shouldn't really do this on a regular basis, but just for testing purposes, try putting the style inline and see if that helps:
<a href="mailto:xxx@xxx.org" style="text-decoration:und erline;" title="Send an Email">Contact Us</a></li>
<a href="mailto:xxx@xxx.org" style="text-decoration:und
ASKER
I already tried it, but didn't work. Very strange...
ASKER
FYI, if I switch around the first "contact us" and the second "contact us", it still didn't work. so, I am thinking something wrong the first contact us link. If I get rid of the image in front it, it still doesn't work.
Is the link clickable? does it work, just without an underline, or is it completely disabled?
ASKER
yes, the link is clickable and it works. just no underline...
maybe in some other css file the visited state is overriden - just guessing here.
you could try setting all the states and using !important:
a:link, a:hover, a:visited, a:active{
text-decoration:underline !important;
}
you could try setting all the states and using !important:
a:link, a:hover, a:visited, a:active{
text-decoration:underline !important;
}
ASKER
sorry, no luck...
BTW, how come the first link does show in IE 8 (my laptop)?
BTW, how come the first link does show in IE 8 (my laptop)?
ASKER
a:link, a:hover, a:visited, a:active{
text-decoration:underline !important;
}
the above code made other link(no underline) on the navigation panel underline though...
text-decoration:underline !important;
}
the above code made other link(no underline) on the navigation panel underline though...
ASKER
I just tested it thru Citrix and the underline appears for a just split second and then disappears.....weird.
yes, it would make all links underline because I didn't specify any containing class. I left that up to you.. :)
not sure what else to suggest..
if you really want an underline though, you could "cheat", and give it a border-bottom.
not sure what else to suggest..
if you really want an underline though, you could "cheat", and give it a border-bottom.
ASKER
border-bottom cheat didn't work either. I don't think any style works for the first contact us link...
it sounds like something is covering it. Can you post a link to the actual page?
ASKER
it is an intranet site...
oh.
At this point without actually seeing the page there's not much more comes to mind.. sorry.
the only other thing I can see is an extra space between the a and the href, but Im grasping at straws...
At this point without actually seeing the page there's not much more comes to mind.. sorry.
the only other thing I can see is an extra space between the a and the href, but Im grasping at straws...
ASKER
what would you suggest to make the "Contact Us" a link?
I tried <b> around <a href> tag and it worked.
I tried <b> around <a href> tag and it worked.
ASKER
I meant to make looks like a link intuitively...
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
or you could do something like add symbols and add the words "click here":
>> click here to email us <<
>> click here to email us <<
ASKER
background-color:yellow worked, but border-bottom:1px solid blue didn't work.
>> click here to email us << is too long.
>> click here to email us << is too long.
hmmm... there is something on the bottom obscuring it - I don't know...
ASKER
you tried enough. I will give you points. thanks for your help.
:)
hope it works out..
hope it works out..
Without have the website link, it would be difficult for us to test...but not impossible. If not solved before I get back from lunch, I will take a deeper look into this.