Forum Moderators: open
I have some problem getting the same result in ff3 and ie7
here is the structure of the page. I removed the content which is some texts and flash content.in FF3 the content is a little bit lower. In IE7 it is as in the Dreamweaver preview. THX for your help
<!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=utf-8" />
<title>DAO & Co</title>
<style type="text/css">
<!--
body { background-color: #FFF;}
a { outline: none;
color:#000}
:focus { -moz-outline-style: none;}
p{
font-family: Verdana;
font-size:36px;
font-smooth:always;
color:#383838;
line-height:23px;
}
-->
</style>
</head>
<body>
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="position:absolute; top:50%; margin-top:-260px;">
<tr><td align="center" valign="top">
<table width="960" border="0" cellspacing="0" cellpadding="0" background="pictures/bg-text.jpg">
<tr>
<td width="320" height="520" align="left" valign="top"><table width="320" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="110" align="center" valign="middle"> </td>
<td width="44" align="center" valign="top"> </td>
<td width="44" align="center" valign="top"> </td>
<td width="44" align="center" valign="top"> </td>
<td align="center" valign="middle"> </td>
</tr>
</table></td>
<td width="640" valign="top" align="left"><table width="640" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="210" height="15"></td>
<td width="320"> </td>
<td width="110"> </td>
</tr>
<tr>
<td height="78"> </td>
<td> </td>
<td align="left" valign="top"> </td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="34" height="30"></td>
<td align="left" valign="top" colspan="2"> </td>
</tr>
<tr>
<td height="290" align="right" valign="middle"> </td>
<td width="190" valign="top"><p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p>A</p></td>
<td align="left" valign="top" width="390"><p align="left"> </p>
<p align="left"> </p>
<p align="left"> </p>
<p align="left"> </p>
<p align="left"> </p>
<p align="left">A</p></td>
</tr>
</table></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
* {
margin:0;
padding:0
}
But then you have to go back and adjust everything for the spacing you want.
Note that all CSS sizes need the units to be specified: px, em, pt, %, etc.
I think this is against some accessibility guidelines (if you navigate with a keyboard instead of a mouse it's handy to know what you're going to "click" on).
-CSS_Kidd
so I removed the cellpading and cellspacing in the tables and added your code to the css but it didn't seem to work, the margins appeared then.
-g1smd
could you please give me an example of how to do it in CSS
-swa66
I used this code to remove an ugly outline around my swf content. In this website design is more important than accessibility.
Thanks again to everyone
W3C Validator - HTML [validator.w3.org]
W3C Validator - CSS [jigsaw.w3.org]
