By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
446,156 Members | 1,004 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 446,156 IT Pros & Developers. It's quick & easy.

IE: Top and Bottom of border not showing

P: n/a
Hello,

I'm having a problem where a style for a <a> tag
isn't working in IE:

border : 1px solid red;

If you use my code below, you'll see what I mean.
In IE6 on WinXP, I'm not seeing a red top and
bottom border. My HTML validates. It looks
exactly like I want it to in Firefox and Opera.

I recommend pasting my text into a file and then
viewing it to easily see what's going on.

Thanks.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1" />

<title> New Document </title>

<style type="text/css">

body
{
background-color : #bfbfbf;
text-align : center;
padding : 0px;
margin : 0px;

}

#mainDiv
{
width : 100%;
padding : 0px;
background-color : white;
background-image : url(images/bg1.gif);
}

#divContainer
{
width : 800px;
border-right : 1px solid black;
border-left : 1px solid black;
margin : 0 auto 0 auto;
}

#titleSection
{
width : 100%;
background-color : white;
/*background-image : url(images/logo1.jpg);*/
height : 120px;
margin : 0 auto 0 auto;
/*border-top : 1px solid gray;*/
border-bottom : 1px solid black;
text-align : left;
}

#titleSection img
{
margin-top : 10px;
}

/* //////////////////////////
//////// Global Links ////
////////////////////////// */
#globalLinks
{
width : 100%;
background-color : #224466;
margin-right : auto;
margin-left : auto;
text-align : left;
}

#globalLinks ul
{
margin: 0;
padding: 0;
list-style-type: none;

}

#globalLinks ul li
{
display: block;
float : left;
text-align: center;
padding: 0;
margin: 0;
}

#globalLinks ul li a
{
color : white;
text-decoration : none;
background-color : #2B5B87;
padding : 4px 8px 4px 8px;
margin : 0px;
border-right : 1px solid black;
font-family : Verdana;
font-weight : bold;

}

#globalLinks ul li a:hover
{
background-color : #3583CB;
}
/* //////////////////////////////
////// Control Bar ///////////
/////////////////////////////// */
#controlBar
{
width : 100%;
background-color : #AABBCC;
padding-bottom : 4px;
padding-top : 2px;
margin-bottom : 0px;
margin-right : auto;
margin-left : auto;
/*text-align : left;
padding-top : 10px;*/
}

#globalNav ul
{

list-style-type: none;
margin: 0;
padding: 0;
text-align: center;
}

#globalNav ul li
{
display: inline;

}

#globalNav ul li a
{
text-decoration: none;
padding: 2px 4px 2px 4px;
color: #fff;
background-color: #036;
border : 1px solid red;
}

#globalNav ul li a:hover
{
color: #fff;
background-color: #369;
border : 1px solid green;
}
/* /////////////////////
////// Content //////
///////////////////// */
#content
{
width : 100%;
background-color : white;
height : 500px;
margin-right : auto;
margin-left : auto;
}

</style>
</head>

<body>
<div id="mainDiv">
<div id="divContainer">

<!-- <div id="globalLinks">
<ul>
<li><a href="">Help</a></li>
<li><a href="">About</a></li>
<li><a href="">Logout</a></li>
</ul>
&nbsp;
</div>
-->
<div id="titleSection">
<img src="images/logo5.jpg" alt="Tracking
Management Tool" />
</div>

<div id="controlBar">

<div id="globalNav" style="float:left; padding
: 2px 0px 2px 3px">
<ul>
<li><a href="">Home</a></li>
<li><a href="">Help</a></li>
<li><a href="">About</a></li>
<li><a href="">Logout</a></li>
</ul>
</div>

<div style="float:right; text-align : left;">
<input type="text" size="10" />
<input type="button" value="Search for SIG/CR
#" />
<a href="">[Advanced]</a>
</div>
Welcome, User!

</div>

<div id="content"></div>

</div>
</div>

</body>
</html>
Jul 21 '05 #1
Share this Question
Share on Google+
1 Reply


P: n/a
Trent L <sp*******@hotmail.com> wrote:
I'm having a problem where a style for a <a> tag
Element.
If you use my code below


Don't post code to the group, delete all non essential code and post an
url instead: http://www.spartanicus.utvinternet.i...s_help_you.htm

--
Spartanicus
Jul 21 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.