I have a page located at
http://webdev.eskycity.com/nkymls/CA/ that uses xhtml strict. On this page is a table that uses CSS to define td column widths as well as other fornatting attributes. The problem I am having is that one row of the table has two columns that are not displaying at proper width, maybe the better way to word this is that there is a padding or margin that is being added to right hand side. I have highlighted the column on the page with a red background for thos who choose to view it.
Here is the CSS being used for the left column......
content_column_left {
vertical-align: top;
width: 570px;
padding: 0px;
margin: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
Here is the right one (currently has a red bg color.........
.column_content_right {
vertical-align: top;
width: 258px;
padding: 0px;
margin: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
Here is the style for the paragrahs in both columns ...............
p {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
vertical-align: top;
text-align: left;
padding: 0px;
color: #666666;
margin-top: 5px;
margin-right: 5px;
margin-bottom: 5px;
margin-left: 15px;
line-height: 20px;
}
and.... here is the style for the image located in the column.......
.left-pad-image {
margin-left: 5px;
text-align: right;
float:right;
}
Now.... if I remove everything from the column it sizes appropriately. However, if add anything back that is controlled by a css atribute, or just a table, it builds that right side buffer back in the column. Any and all help appreciated.
Start Free Trial
