Div box not showing up

**hardcore** · 12-04-2005 12:41 PM

Hello,

Having problems getting one of my div id's to show up. The one particular div-id I cannot get to work, or show up on my page is the following

<div id="news">
<ul>
<li><img src="images/shire_42.jpg"></li>
<li><img src="images/shire_49.jpg"></li>
</ul>
</div>

with the following style:

#news {
postition: absolute;
top: 433px;
left: 42px;
width: 100%;
height: 100%;
}
#news ul {
list-style-type: none;
}
#news li {
display: block;
margin: 0%;
padding: 0%;
width: auto;
font-size: 50%;
line-height: 50%;
}

What am I doing wrong. What is the reason as to why this particular div box is not showing up?

Thx in advance.

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>Test</title>
<style type="text/css">

#container {
  position:relative;
  margin: auto;
  width: 860px;
  height: 950px;
}
#banner {
  position: absolute;
  top: 0px;
  width: 860px;
  height: 100%;
}
#leftbor { 
  position: absolute;
  background-image: url('images/shire_02.jpg');
  background-repeat: repeat-y;
  top: 150px;
  height: 100%;
}
#rightbor {
  position: absolute;
  background-image: url('images/shire_11.jpg');
  background-repeat: repeat-y;
  top: 150px;
  left: 830px;
  height: 100%;
}
#navbar {
  position: absolute;
  left: 30px; 
  top: 150px;
  height: 33px;
  font-size: .9em;
  margin: 0;
  width: 100%;
}
#navbar ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  font-family: verdana, arial, sanf-serif;
  font-size: 14px;
  height: 33px;
}
#navbar li {
  width: 100px;
  height: 31px;
  float: left;
  list-style-type: none;
  padding: 0;
}
#navbar a {
  display: block;
  padding: 10px 10px 5px 22px;
  background-image: url(images/shire_03.jpg);
  background-repeat: no-repeat;
  background-position: 0% 50%;
}
#navbar a:link, #navbar a:active, #navbar a:visited {
  color: #cccccc;
  text-decoration: none;
}
#navbar a:hover, #navbar a:active {
  background-image: url('images/shire_03_over.jpg');
  background-repeat: no-repeat;
  background-position: 0% 50%;
}
#newsback {
  position: absolute;
  background-color: #333333;
  top: 183px;
  left: 30px;
  width: 800px;
  height: 100%;
}
#newsgroup1 {
  position: absolute;
  top: 190px;
  left: 42px;
}
#newsgroup2 {
  position: absolute;
  top: 190px;
  left: 306px;
}
#newsgroup3 {
  position: absolute;
  top: 190px;
  left: 570px;
}
#newsgroup1 ul,
#newsgroup2 ul,
#newsgroup3 ul {
  display: block;
  margin: 0%;
  padding: 0%;
}
#newsgroup1 li,
#newsgroup2 li,
#newsgroup3 li {
  display: block;
  margin: 0%;
  padding: 0%;
  width: auto;
  font-size: 50%;
  line-height: 50%;
}
#main {
  position: absolute;
  top: 400px;
  left: 42px;
  width: 780px;
  height: 100%;
}
#news {
  postition: absolute;
  top: 433px;
  left: 42px;
  width: 100%;
  height: 100%;
}
#news ul {
  list-style-type: none;
}
#news li {
  display: block;
  margin: 0%;
  padding: 0%;
  width: auto;
  font-size: 50%;
  line-height: 50%;
}
#mainbottom {
  position: absolute;
  top: 800px;
  left: 42px;
  width: 100%;
}
  
</style>
</head>
<body bgcolor="#000000" text="#FF0000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
	<div id="container">
		<div id="banner"><img src="images/shire_01.jpg"></div>
		<div id="leftbor"><img src="images/shire_02.jpg"></div>
		<div id="navbar">
			<ul>
				<li><a href="#">Home</a></li>
				<li><a href="#">Forums</a></li>
				<li><a href="#">Stats</a></li>
				<li><a href="#">Server</a></li>
				<li><a href="#">Members</a></li>
				<li><a href="#">Rules</a></li>
				<li><a href="#">Files</a></li>
				<li><a href="#">Support</a></li>
			</ul>
		</div>
		<div id="rightbor"><img src="images/shire_11.jpg"></div>
		<div id="newsback"></div>
		<div id="newsgroup1">
			<ul>
				<li><img src="images/shire_13.jpg"></li>
				<li><img src="images/shire_19.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_34.jpg"></li>
			</ul>
                </div>
		<div id="newsgroup2">
			<ul>
				<li><img src="images/shire_15.jpg"></li>
				<li><img src="images/shire_19.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_34.jpg"></li>
			</ul>
                </div>
		<div id="newsgroup3">
			<ul>
				<li><img src="images/shire_17.jpg"></li>
				<li><img src="images/shire_19.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_22.jpg"></li>
				<li><img src="images/shire_34.jpg"></li>
			</ul>
                </div>
		<div id="main"><img src="images/shire_39.jpg"></div>
		<div id="news">
			<ul>
				<li><img src="images/shire_42.jpg"></li>
				<li><img src="images/shire_49.jpg"></li>
			</ul>
	 	</div>
		<div id="mainbottom"><img src="images/shire_59.jpg"></div>
	</div>
</body>
</html>

**FromU2ME** · 12-04-2005 02:08 PM

I don't think it's the div you cannot show, it's most likely the list-posts you are having problems with. Try typing display: "none" or remove that line!

Thread: Div box not showing up

Thread Tools

Display

Div box not showing up

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions