Strange Thing With Mozilla

**natimage** · January 17, 2004

OK...I've made some changes and such to my site. Several people here have given me opinions and such and I've got the majority of the site under control again. Thanks for all the suggestions and comments!

I'm having a problem in Mozilla 5.0, though. I created 1row tables to go under my rows of pics so that I could add captions and keep them centered. Pics are NOT in tables themselves. Then, I positioned the table using CSS, as it was too far down for my liking. Here's the css code:

>.captionTable {
top margin: 0px;
position: relative;
top: -17px;
left: 0px;
}

The code works. But, RANDOMLY, when Mozilla loads one of these pages, the captions for the images will be too high up, placing the image in the background. Then if I hit refresh, it loads properly and the text is where it should be.

Is there something about Mozilla that I'm unaware of in regards to CSS relative positioning? I'll go look on mozdev, but I thought someone here might know about this already.

Here's one page...

Thanks! Rock Sign

Edited January 17, 2004 by natimage

**vangrieg** · January 17, 2004

Before diving into it further, I'd notice that there's no "top margin" property in CSS. It should be "margin-top".

**natimage** · January 18, 2004

...I knew that. At least, several hours ago I knew that!!! I don't know that it will help, but I'll certainly give it a try!!!

**krieser** · January 18, 2004

Do you have a link to a page, or some code? Are you specifying the image dimensions? Maybe when the page is loading the first time, the images haven't fully loaded and the browser doesn't really calculate the space for them. Then it positions the captions/tables over the spot where the images will be (using the browsers native image place holder - whatever size that is). While the browser is rendering the rest of the page the image has finished loading, and everything seems to come together (wrong) at the same time. On reload, your images would already be in your internet cache, so the browser knows how much space it needs for the image, and there's no problem. Maybe?? Just my two cents...

Good luck anyway!!

Kris

**natimage** · January 18, 2004

hmmm...let me research that for a bit. The link to one of about 8 pages that is doing this is in the top post.

...nope. Width and height are specified for the images...no image placeholders.

everything seems to come together (wrong) at the same time

no doubt about this one!!

On reload, your images would already be in your internet cache, so the browser knows how much space it needs for the image, and there's no problem

This would seem to make sense. But, if I leave a particular page that has loaded fine and then come back to it via links, it will do it again...even though the images are cached.

I think we need an emoticon that scratches both sides of it's head...

**natimage** · January 18, 2004

I don't know that this will help, but I've noticed something in my continuous work on this. When the page loads incorrectly, and then I hit the refresh button...everything from the white tiger pic on left hand side shifts down an amount equal to about one line break. I've studied and studied the code to no avail. All the images have height and width set. For the images on the left side, they are all separated by one set of <p> with 's in the <p> tags.

Any help would be so wonderful!!!! I'm ready to pull my hair out!!

**natimage** · January 18, 2004

Notes in Netscape 4.0+:
* Relative positioning does not work with list items, form fields, hyperlinks, images, table, or table cells

* Absolute positioning does not work with list items, hyperlinks, or form fields

* If Absolute positioning is used you must specify the "top" and "left" properties

Could this have anything to do with my little problem? I am using relative positioning inside a table cell. I don't know...that part of it seems to work. Seems like there is something else in the page causing it.

...UPDATE...the answer to above question is no. I removed all the tables that contained the caption and the pages still refresh differently than they load to begin with. It's like it's not seeing something, and then all of a sudden it does...

Come to think of it...one of the TCH pages I visited did this, in a sense. It would completely load and all the text would be out of wack, then I hit refresh and it loaded correctly...hmmm...I'll see if I can't find that page!

**krieser** · January 18, 2004

Oops! There was a link. :shutup: I'll take another look...

Maybe we need a pulling-out-your-hair emoticon...

Kris

**krieser** · January 18, 2004

Also, what browser version are you using. I can't duplicate it on my pc. If you're serving up different code via php for different users, let me try what you're using...

**natimage** · January 18, 2004

I'm using Mozilla 5.0. The Reseller's Support page HERE is the page that loads wrong for me, then loads correctly upon refresh! Maybe there is something wrong with my Mozilla?????

**natimage** · January 18, 2004

If you're serving up different code via php for different users

...I wouldn't even know where to begin to do that. I'm lucky to serve the little php that I serve!!

**krieser** · January 18, 2004

Sorry, I can't get it to work (or not work). Your page looks great from my pc. I'm running WinXP Pro, and tried it in Mozilla browser v1.4 (5.0 engine) and Netscape 7.1, as well as a few others... Like you mentioned, it seems to be that the browser is 'forgetting' something, and then on reload, figures it out. I wondered about your 'DTD' declaration, but the fact that it reloads fine leads me to believe it's something else.

**natimage** · January 18, 2004

Krieser...thanks for trying!! I miss-stated my browser version...it's version 1.5 with 5.0 engine! Maybe someone else out there is using the same and can replicate the problem. I guess I just won't worry about it for now. It does not happen in IE, which is what most use, so I'm ok there.

Thanks again for your time!!!

**Deverill** · January 18, 2004

Tracy,

I'm using Firebird 0.7 and on your example page the 1st 2 rows are fine but the last row is doing what you describe.

The one thing I noticed is that when I reload and the captions line up, the pictures in that row shift slightly to the left. There may be something at or right before the 1st pic in the 3rd row that is causing the problem.

Sorry I don't have any ideas but at least I confirmed it's not just you! <_<

**Deverill** · January 18, 2004

Tracy,

I looked at your source and think there's a more reliable way to do the layout for your page.

You currently have 3 tables for the captions but the images are outside the tables. I think if you include the pics in table rows with the captions interspersed it would work better.

You would probably be better off with:

><TABLE>
<TR>
 <TD> image 1 stuff </td>
 <td>  image 2 </td>
 <td>  image 3 </td>
</tr>
<tr>
 <td> caption 1 </td>
 <td> caption 2 </td>
 <td> caption 3 </td>
</tr>
etc...

This may be what's confusing the browser, although it shouldn't. I think making it one table with 6 rows and 3 columns each will suit you better.

Hope it helps!

**natimage** · January 18, 2004

Thanks for looking, Jim...and confirming that it isn't just me. I even installed Mozilla 1.6 last night, hoping that there was something wrong with my Mozilla install. Obviously not, though.

I considered putting the images in tables, but I was just trying to avoid it. I'd really like to move into CSS layout and away from Table layout. But, in the end, I may not have too much of a choice. Depends on how deep into the CSS I want to go! So far I like it a lot, but haven't done too much.

Also...I searched and searched my code and couldn't for the life of me find anything that would cause this problem. Did you have the same thing happen on the Reseller Support link that I posted in an above comment? Same thing (kinda) there...upon first load it is all whacked out, then refreshes fine. Everytime I go there. Strange, huh?

I forgot this part...at one point I commented out all the caption tables and it still had the glitch...

Edited January 18, 2004 by natimage

**Deverill** · January 19, 2004

On the reseller page it was much harder to get it to trip out and the only thing I noticed was the words on the left side shifted up a tiny bit but not out of place either way. Maybe I just wasn't holding my mouth right.

I understand about CSS and tables. I played briefly with it before but when I found out how inconsistent the browsers were on it I decided that tableless design was for another time.

**natimage** · January 19, 2004

It is inconsistent, that's for sure. I think I'm going to try and successfully combine the two concepts. BUT...I'm still not re-doing those image pages just yet. :lol: It'll have to wait at least a couple of weeks. I've got 2 "volunteer/donation" jobs that will be a much lighter weight to bear once I get finished with them.

Sign In

Strange Thing With Mozilla

Recommended Posts

natimage

vangrieg

natimage

krieser

natimage

natimage

natimage

krieser

krieser

natimage

natimage

krieser

natimage

Deverill

Deverill

natimage

Deverill

natimage

Join the conversation

Hosting