PDA

View Full Version : [WinXP] IE6/Avant working, FireFox 0.9 failing the 1st time but fine after a refresh


Noiz Pollution
09-12-2004, 11:16 AM
Hi folks,

A small browser issue here, seemingly with CSS. I've attached a couple of screen dumps so you can see what's happening.

The 1 showing just a white rectangle with curved corners, some text and an image is how the page should display and does in IE/Avant and in FireFox 0.9.3 after a refresh, the other is how the page displays in FireFox 0.9.3 on 1st view or after a hard refresh (ctrl+F5), it seemed to work in 0.8.

Below is the code which is involved in that part of the page.

The stylesheet (please ignore the table attribute, a lot of people refuse to believe the trick of adding font-size: 100% to it works but it really saves me adding another class for td)
<style type="text/css">
<!--
body {margin: 0px; background-color: #3B3B3B; font-family: tahoma, verdana, arial, helvetica; font-size: 8pt; color: #888888;}
table {font-size: 100%;}
.main_table {width: 100%; height: 100%;}
.content_table {width: 770px; height: 100%; background-image: url(files/gfx/content_table_bg.gif); background-repeat: repeat-y;}
.header_cell {height: 115px; background-image: url(files/gfx/header_bg.gif); background-repeat: repeat-x;}
.content_cell {background-color: #C6C6C6; background-image: url(files/gfx/content_bg.gif); background-repeat: repeat-x;}
.left_menu_top_01 {width: 100%; height: 100%; background-color: #B3B3B3; background-image: url(files/gfx/left_menu_top_01.gif); background-position: 0px 0px; background-repeat: repeat-x;}
.left_menu_top_02 {width: 100%; height: 100%; background-color: #B3B3B3; background-image: url(files/gfx/left_menu_top_02.gif); background-position: 0px 0px; background-repeat: no-repeat;}
.left_menu_btm {width: 100%; height: 100%; background-image: url(files/gfx/left_menu_btm.gif); background-position: 0px 100%; background-repeat: repeat-x;}
.content_top {width: 100%; height: 100%; background-color: #FFFFFF; background-image: url(files/gfx/content_top.gif); background-position: 0px 0px; background-repeat: no-repeat;}
.content_btm {width: 100%; height: 100%; background-image: url(files/gfx/content_btm.gif); background-position: 0px 100%; background-repeat: repeat-x;}
.footer_cell {height: 100%; background-image: url(files/gfx/footer_bg.gif); background-repeat: repeat-x; text-align: center;}
.footer_navigation {margin-top: 10px; font-size: 10px; color: #EF5EB5;}
a.footer_navigation_link:link, a.footer_navigation_link:visited {color: #CCCCCC; text-decoration: none;}
a.footer_navigation_link:hover, a.footer_navigation_link:active {color: #000000; text-decoration: none;}
.footer_copyright {margin-top: 4px; font-size: 10px; color: #919191;}
a.footer_copyright_link:link, a.footer_copyright_link:visited {color: #919191; text-decoration: none;}
a.footer_copyright_link:hover, a.footer_copyright_link:active {color: #333333; text-decoration: none;}
.image_right_top {margin-bottom: 12px; margin-left: 12px; margin-right: -2px; float: right;}
// -->
</style>

The HTML segment
<tr>
<td>
<div class="content_top"><div class="content_btm">
<table width="501" cellpadding="13" cellspacing="0" border="0">
<tr>
<td><img class="image_right_top" src="files/gfx/content/company/logo_button.jpg" border="0" />Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old<br /><br />
Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old Blah blah yeah yeah yeah same old same old </td>
</tr>
</table></div></div></td>
</tr>

If anybody can help with this issue it would be greatly appreciated :rolleyes:


Cheers,
Robert

Noiz Pollution
09-12-2004, 02:01 PM
Don't worry about it, fixed it myself.

*waits for the first person to say "why don't you post how you fixed it?"*

Cheers,
Robert

Tekton
09-12-2004, 04:36 PM
why don't you post how you fixed it?

;)

Noiz Pollution
09-14-2004, 11:52 AM
why don't you post how you fixed it?

;)
Seemingly it's a bug in FF 0.9.3, I needed to add thewidth and height attributes to the image.


Cheers,
Robert