Div problems

Far Cry · December 6, 2011

For some reason, it seems the attack-items div is going outside the content div, (hence the border). I'm trying to make it so the attack-items and attack-items-header divs lay on top of each other, I'm out of ideas here.

HTML

 



<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Crime Town</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="js/jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.pack.js"></script>

</head>
<body>
<div id="container">
<div id="header">
<img src="images/originallogo.png">
</div>



<div id="navbar"> 
  <ul> 
        <li><a href="index.php">Home</a></li>
        <li><a href="admin.php?page=home">Admin Panel</li>
        <li><a href="items.php">Items</a></li>
        <li><a href="shops.php">Shops</a></li>
        <li><a href="logout.php">Logout</a></li>
  </ul>
</div> 
<br />
<div id="user-info-header"><span id="span-user-info-header">User Info</span></div>
  
  <div id="user-info">

  <ul>
       <li>Name: Administrator</li>
       <li>Level: 1</li>
       <li>Cash: $10,000,003,939</li>
       <li>Health: 5,000/5,000</li>
       <li>Energy: 100/100</li>
       <li>Nerve: 10/10</li>
  </ul>
</div>


<div id="content" align="center" style="border: 5px solid red;">

<div id="attack-items-header">Your Items</div>
<div id="attack-items">
<table cellspacing="10">
<tr>
<td>Primary</td>
<td>Secondary</td>
<td>Melee</td>
</tr>
<td><a href="attack.php?action=use&it_id=18">Shotgun</a></td><td>None</td><td>None</td></table>
</div>


</div><!--Content-->
</div><!--Container-->
</body>
</html>

CSS

#attack-items {
   font-weight:bold;
   width:250px;
   border:2px solid #000;
   margin-left:5px;
   margin-top:300px;
   margin-bottom:-300px;
  
} 

#attack-items-header {
       width:250px;
       background-color:#000;
       margin-top:300px;
} 

#container {
height:100%;
}

#content {
margin-top:-143px;
margin-bottom:143px;	
}

Thanks!

sunfighter · December 7, 2011

In the attack-items div you have two <td>'s that should be encased by <tr>'s

<tr>

<td>Primary</td>

<td>Secondary</td>

<td>Melee</td>

</tr>

<td><a href="attack.php?action=use&it_id=18">Shotgun</a></td>

</table>

</div>

Sign In

Div problems

Recommended Posts

Far Cry

Link to comment

Share on other sites

sunfighter

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information