Fri, 2011-11-25 08:11
Hi, my problem is, that i probably do something wrogn with the CSS on my site. Within Safari the website looks just fine and as intended, but with Avant the images have empty space around, and some are even in a new line due conflict with the table's cell width and that strange spacing around each image. Who can assist me with the right CSS data, so that the website looks the same good in IE-related browsers as in Safari?
URL: jamaica-focus.com/SvenLittkowski
Code:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title></title> <base target="Page"> <script language="JavaScript"> <!-- // --> </script> </head> <body style="background: url(v/Pages/Title.jpg) fixed no-repeat; background-position: top; background-color: #<?PHP echo($SeitenFarbeControl); ?>; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px""> <table style="width: 950px; height: 120px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px; text-align: left; vertical-align: top;"> <tr> <td style="width: 950px; height: 5px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px; text-align: right; vertical-align: top;" colspan="5"> </td> </tr> <tr> <td style="width: 111px; height: 114px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px; text-align: left; vertical-align: top;"> <img src="v/FXs/LinkContactPassive.jpg" width="111" height="27" border="0" alt="Contact Form" title="Contact Form"> </td> <td style="width: 126px; height: 114px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px; text-align: center; vertical-align: top;"> <img src="v/Deco/Glass.gif" style="width: 7px; height: 12px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px;"> <img src="v/FXs/LinkHomePassive.gif" style="width: 85px; height: 12px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px;" alt="Contact Form" title="Contact Form"> <img src="v/Deco/Glass.gif" style="width: 22px; height: 12px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px;"> </td> <td style="width: 96px; height: 114px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px; text-align: left; vertical-align: top;"> </td> <td style="width: 467px; height: 114px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px; text-align: left; vertical-align: top;"> <img src="v/FXs/LinkArticlesPassive.jpg" width="147" height="27" border="0" alt="Contact Form" title="Contact Form"> <img src="v/Deco/Glass.gif" width=" 13" height="27" border="0"> <img src="v/FXs/LinkImagesPassive.jpg" width="147" height="27" border="0" alt="Contact Form" title="Contact Form"> <img src="v/Deco/Glass.gif" width=" 13" height="27" border="0"> <img src="v/FXs/LinkStreamerPassive.jpg" width="147" height="27" border="0" alt="Contact Form" title="Contact Form"> </td> <td style="width: 88px; height: 114px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px; text-align: right; vertical-align: top;"> </td> </tr> <tr> <td style="width: 950px; height: 1px; border-style: none; border-with: 0px; padding: 0px; border-spacing: 0px; text-align: left; vertical-align: top;" colspan="5"> <img src="v/FXs/TitleWide.gif" border="0" width="950" height="1"> </td> </tr> </table> </body> </html>
Fri, 2011-11-25 08:23
#1
Firstly you have no DTD, so
Firstly you have no DTD, so no Standards mode for browsers. You need to fix that as your first priority then re-check your layout and see how things look. The other issue is do not use proprietary character sets; windows-1252 is an abomination, get that changed to utf-8 which is pretty much the de-facto standard nowadays.
Fri, 2011-11-25 23:58
#2
Thanks, Hugo.
Thanks, Hugo. Yes, these things are standards. I just added them both. I simply forgot them.
However, there is still no change, that problem still endures (within Avant/IE). Did you have a chance to check my own CSS? I bet something is missing.
EVERYONE: I STILL NEED HELP. Thanks.
Sat, 2011-11-26 09:06
#3
As Avant comes with two
As Avant comes with two rendering engines I would actually not refer to it so much as to one of the parent browsers that originated the rendering engines i.e IE or Mozilla which is it that is causing the issue? or put another way which browser Firefox or IE is demonstrating the problem (I do note you mention IE in the opening post). Is the issue reflected in an IE browser proper?
Would you sort your link out so that it points to the page showing the issue as the link posted is essentially a splash page for your site? it helps us if we are linked to problem pages directly.
Oh and slight tangential topic but the pages existing under that domain all appear to be using framesets, these are all but redundant nowadays, it might be time to think about updating them?
In the posted example markup I would be starting to remove all that inline styling as it doesn't really help matters, move it to the head as embedded styles until ready to add them as an external file it's far easier to work with rulesets than with inline styling
Fri, 2011-12-02 04:42
#4
Thanks again, Hugo. The URL
Thanks again, Hugo.
The URL is:
http://jamaica-focus.com/SvenLittkowski/Title.php5
It is the IE which doesn't display properly.
Mozilla is just fine.
All other points: taken, but will address them after this problem has been solved. Thanks, too. 