?
Solved

Content Spilling Over Table Cell

Posted on 2009-02-24
2
Medium Priority
?
271 Views
Last Modified: 2012-05-06
Can someone tell me what is causing the content to spill over the table cell in the code below. You can preview what is happening at http://www.forcesinfocus.com/northwoods_summarycss.html.

Sorry, I am learning slowly but surely. These seemingly little issuess are about to make my head explode, however!!
/* CSS Document */
body {
 margin:0px;
 padding:0px;
 background-color:#C60;
 color: #666666;
 font: small Verdana, Arial, Helvetica, sans-serif;
}
#wrapper {
 margin:0px;
 padding:0px;
 width:800px;
}
#header {
 margin:0px;
 width:800px;
}
#leftnav {
 margin:0px;
 width:272px;
 height:282px;
 background-image:url(../images/nw_images/nav_bkgd.png);
 background-repeat:no-repeat;
 text-align:right;
 float:left;
 font:100% Verdana, Arial, Helvetica, sans-serif;
}
#leftnav p {
 margin:0;
 padding: 130px 47px 0px 0px;
 text-align:right;
}
#leftnav a:link, a:active{
 color:#ff9;
 text-decoration:none;
 background-image:url(../images/nw_images/link_small.png);
 background-repeat:no-repeat;
 background-position: left center;
 padding-left:13px;
}
#leftnav a:hover {
 color:#000;
 text-decoration:none;
 background-image:url(../images/nw_images/linksmall_visited.png);
 background-repeat:no-repeat;
 background-position: left center;
 padding-left:13px;
}
#leftnav a:visited {
 color:#ff9;
 text-decoration:none;
 background-image:url(../images/nw_images/linksmall_visited.png);
 background-repeat:no-repeat;
 background-position: left center;
 padding-left:13px;
}
#content {
 background-color:#fff;
 text-align:left;
 width:528px;
 margin:0px 0px 20px 272px;
 padding:67px 0px 20px 0px;
}
#content table {
 margin-top:0px;
 margin-left:35px;
 margin-right:35px;
 vertical-align:top;
 display:block;
 border:none;
 font:80% Verdana, Arial, Helvetica, sans-serif;
}
#content td {
 vertical-align:top:
}
#content p {
 font:100% Verdana, Arial, Helvetica, sans-serif;
 padding:0px;
 margin:0px 0px 0px 35px;
}
#content td p {
 font:100% Verdana, Arial, Helvetica, sans-serif;
 padding:0px;
 margin:0px 0px 0px 0px;
}
#content h1 {
 font:110% Verdana, Arial, Helvetica, sans-serif;
 font-weight:bold;
 color:#f90;
 margin:0px 0px 0px 35px;
}
#content h2 {
 font:100% Verdana, Arial, Helvetica, sans-serif;
 font-weight:bold;
 color:#999;
 margin:0;
 padding:0;
}
#content table .text {
 font:100% Verdana, Arial, Helvetica, sans-serif;
 color:#666;
 margin:0;
 padding:0;
}
--------------------------HTML--------------------------------
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="northwoods/style.css" />
<title>Untitled Document</title>
<style type="text/css">
<!--
.style1 {color: #FFFFFF}
-->
</style>
</head>
<body>
<div id="wrapper">
  <div id="header">
  <img src="images/nw_images/nw_header.png" /><br />
  </div><!-- header -->
  <div id="leftnav">
  <p>
  <a href="northwoods_summary.html">summary</a><br />
  <a href="northwoods_location.html">location</a><br />
  <a href="northwoods_available.html">available</a><br />
  <a href="northwoods_floorplans.html">floorplans</a><br />
  <a href="northwoods_contact.html">contact</a><br />
  </p>
  </div><! -- leftnav -->
  <div id="content">
    <h1>BUILDING SUMMARY</h1>
    <p>&nbsp;</p>
  <table width="100%">
  <tr>
    <td valign="top"><h2>General Info</h2></td>
    <td valign="top" class="text style1">119,000 Rentable SF<br />
      3.5 Floors<br />
      15.0% Common Area Factor </td>
  </tr>
  
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Owner</h2></td>
    <td valign="top" class="text style1">Pace Properties </td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Leasing Firm </h2></td>
    <td valign="top" class="text style1">Colliers Turley Martin Tucker </td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Leasing Agents </h2></td>
    <td valign="top" class="text style1">Matt Murtha and Randy Stephens </td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Developer</h2></td>
    <td valign="top" class="text style1">Linclay Development </td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Year Developed </h2></td>
    <td valign="top" class="text style1">1987</td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Building Size </h2></td>
    <td valign="top" class="text style1">119,000 RSF </td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Floors</h2></td>
    <td valign="top" class="text style1">3.5</td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Floor Size </h2></td>
    <td valign="top" class="text style1">30,000 RSF (average) </td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Parking Ratio </h2></td>
    <td valign="top" class="text style1">1:1,000 RSF (total)/10 covered parking spaces</td>
  </tr>
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr>
    <td valign="top"><h2>Major Tenants </h2></td>
    <td valign="top"><span class="text style1">SUM Total Systems
        <br />
    Computer Associates <br />
    ING North America <br />
    Columbia Information Systems </span></td>
  </tr>
  
  <tr>
    <td valign="top">&nbsp;</td>
    <td valign="top"><span class="style1"></span></td>
  </tr>
  <tr> 
    <td width="24%" valign="top"><h2>After Hours Access</h2></td>
	<td width="76%" valign="top"><p class="text style1">Access is available by utilizing the Galaxy Card Access System. This same building security system can be extended to Tenant's space at an additional cost. This system allows Tenant greater control of the employees and visitors that go in and out of the building.</p></td>
  </tr>
  </table>
  </div>
  <!-- content -->
</div><!-- wrapper -->
</body>
</html>

Open in new window

0
Comment
Question by:ctmtcolumbus
2 Comments
 
LVL 15

Accepted Solution

by:
Tomarse111 earned 2000 total points
ID: 23723745
Try adding a width to the style:


#content table .text {
 font:100% Verdana, Arial, Helvetica, sans-serif;
 color:#666;
 margin:0;
 padding:0;
 width: 350px;
}
0
 

Author Closing Comment

by:ctmtcolumbus
ID: 31550655
Perfect. Thanks!
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
Suggested Courses

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question