hey everybody,
i think you will understand best what I am trying to do if I show you (<!-- m --><a class="postlink" href="http://www.literside.net/coreim/">http://www.literside.net/coreim/</a><!-- m -->). I can't seem to get the rows of dots to line up in rows. They get close, but anytime i fool with something, it gets worse. (e.g. dots dont appear...etc...)
can anyone figure it out?
oh another problem i am having, things dont quite work out in IE (why doesnt that suprise me???) ---screen shot (<!-- m --><a class="postlink" href="http://betaman.net/upload/uploads/ss.TIF">http://betaman.net/upload/uploads/ss.TIF</a><!-- m -->) ...just look at the photo and see what i mean *depressed*If you use h4 as the content of a li then you must use the same for all li's.
h4 has a default margin that is not the same across all browsers.
The use of span for backgrounds is probably causing the misalignment in IE.
Have a look at this solution (the links are in columns):
<!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" xml:lang="en" lang="en"><head>
<title>Core Information Management, Inc.</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="imagetoolbar" content="no">
<style type="text/css">
<!--
body {
background: url(logo.jpg) no-repeat 2% 48%;
text-align: center;
}
#content {
text-align:left;
margin: auto auto;
padding:0 200px;
width:495px;
}
ul {
float:left;
list-style:none;
margin: 0;
padding: 0;
}
li {
margin:40px;
}
a {
display:block;
width:84px;
height:84px;
padding-top:30px;
text-align:center;
text-decoration:none;
color:#fff;
font-size:18px;
}
.top {background:url(row_top.gif) no-repeat;}
.middle {background:url(row_middle.gif) no-repeat;}
.bottom {background:url(row_bottom.gif) no-repeat;}
h3, h5 {
text-align:center;
margin: 0;
padding: 0;
}
h5 {
clear:both;
}
-->
</style>
</head>
<body>
<div id="content">
<h3 title="CoreIM :: Core Information Management">Core Information Management</h3>
<!-- ======================COLUMN ONE================================= -->
<ul>
<li><a class="top" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/about/" id="about" title="About Core Information Management, Inc."><strong>About</strong></a></li>
<li><a class="middle" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/services/" id="services" title="See what WE can do for YOU!"><strong>xxxx</strong></a></li>
<li><a class="bottom" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/contact/" id="contact" title="Interested in having CoreIM work for you? Contact Us!"><strong>xxxx</strong></a></li>
</ul>
<!-- ======================COLUMN TWO================================= -->
<ul>
<li><a class="top" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/about/" id="about" title="About Core Information Management, Inc."><strong>Services</strong></a></li>
<li><a class="middle" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/services/" id="services" title="See what WE can do for YOU!"><strong>Clients</strong></a></li>
<li><a class="bottom" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/contact/" id="contact" title="Interested in having CoreIM work for you? Contact Us!"><strong>xxxx</strong></a></li>
</ul>
<!-- ======================COLUMN THREE=============================== -->
<ul>
<li><a class="top" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/about/" id="about" title="About Core Information Management, Inc."><strong>Contact</strong></a></li>
<li><a class="middle" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/services/" id="services" title="See what WE can do for YOU!"><strong>xxxx</strong></a></li>
<li><a class="bottom" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/contact/" id="contact" title="Interested in having CoreIM work for you? Contact Us!"><strong>xxxx</strong></a></li>
</ul>
<!-- ======================FOOTER================================== -->
<h5>Simplifying Information and Computer Management</h5>
</div>
</body>
</html>
i think you will understand best what I am trying to do if I show you (<!-- m --><a class="postlink" href="http://www.literside.net/coreim/">http://www.literside.net/coreim/</a><!-- m -->). I can't seem to get the rows of dots to line up in rows. They get close, but anytime i fool with something, it gets worse. (e.g. dots dont appear...etc...)
can anyone figure it out?
oh another problem i am having, things dont quite work out in IE (why doesnt that suprise me???) ---screen shot (<!-- m --><a class="postlink" href="http://betaman.net/upload/uploads/ss.TIF">http://betaman.net/upload/uploads/ss.TIF</a><!-- m -->) ...just look at the photo and see what i mean *depressed*If you use h4 as the content of a li then you must use the same for all li's.
h4 has a default margin that is not the same across all browsers.
The use of span for backgrounds is probably causing the misalignment in IE.
Have a look at this solution (the links are in columns):
<!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" xml:lang="en" lang="en"><head>
<title>Core Information Management, Inc.</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="imagetoolbar" content="no">
<style type="text/css">
<!--
body {
background: url(logo.jpg) no-repeat 2% 48%;
text-align: center;
}
#content {
text-align:left;
margin: auto auto;
padding:0 200px;
width:495px;
}
ul {
float:left;
list-style:none;
margin: 0;
padding: 0;
}
li {
margin:40px;
}
a {
display:block;
width:84px;
height:84px;
padding-top:30px;
text-align:center;
text-decoration:none;
color:#fff;
font-size:18px;
}
.top {background:url(row_top.gif) no-repeat;}
.middle {background:url(row_middle.gif) no-repeat;}
.bottom {background:url(row_bottom.gif) no-repeat;}
h3, h5 {
text-align:center;
margin: 0;
padding: 0;
}
h5 {
clear:both;
}
-->
</style>
</head>
<body>
<div id="content">
<h3 title="CoreIM :: Core Information Management">Core Information Management</h3>
<!-- ======================COLUMN ONE================================= -->
<ul>
<li><a class="top" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/about/" id="about" title="About Core Information Management, Inc."><strong>About</strong></a></li>
<li><a class="middle" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/services/" id="services" title="See what WE can do for YOU!"><strong>xxxx</strong></a></li>
<li><a class="bottom" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/contact/" id="contact" title="Interested in having CoreIM work for you? Contact Us!"><strong>xxxx</strong></a></li>
</ul>
<!-- ======================COLUMN TWO================================= -->
<ul>
<li><a class="top" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/about/" id="about" title="About Core Information Management, Inc."><strong>Services</strong></a></li>
<li><a class="middle" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/services/" id="services" title="See what WE can do for YOU!"><strong>Clients</strong></a></li>
<li><a class="bottom" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/contact/" id="contact" title="Interested in having CoreIM work for you? Contact Us!"><strong>xxxx</strong></a></li>
</ul>
<!-- ======================COLUMN THREE=============================== -->
<ul>
<li><a class="top" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/about/" id="about" title="About Core Information Management, Inc."><strong>Contact</strong></a></li>
<li><a class="middle" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/services/" id="services" title="See what WE can do for YOU!"><strong>xxxx</strong></a></li>
<li><a class="bottom" href=http://www.webdeveloper.com/forum/archive/index.php/"http://www.literside.net/coreim/contact/" id="contact" title="Interested in having CoreIM work for you? Contact Us!"><strong>xxxx</strong></a></li>
</ul>
<!-- ======================FOOTER================================== -->
<h5>Simplifying Information and Computer Management</h5>
</div>
</body>
</html>