I can't get photos to display the same way on different browsers

HTML & CSS
1

I need to make this website work, and I’m on a serious deadline.

The photos on the home page of http://bio.eo77.net/ display differently on various browsers. There should be two photos side by side with centered captions underneath them.

What gives?

Thanks!

2

You are using random values to just get it displaying right. Your entire layout is fixed/extremely restrictive. You give random top/left values which will cmpletely break in other browsers, or different zoom / window sizes (make your browser wider/smaller. You’ll see it break quite easily.)

TBH - this will be impossible to get working cross browser, let alone getting it to fully work in ONE browser. I hate to say it, but that entire page needs to be scrapped. That entire methodology for laying the page out should never be used like that.

3

There are problems sure enough. Too much CSS for me to look at ATM, but I fear Ryan’s assessment is correct.

1 Like
4

I believe everyone here is right, but I did discover one problem and fixed only that one: My container DIV didn’t have a closing DIV. That did help a little.

I’m guessing I should try making the outside container absolute, and everything inside relative, so I’ll try that tonight. Also, using percentages instead of pixels.

I’d very much appreciate getting some sample code for just one image so I can understand at least one right way to do the job.

Thank!

5

The dark wood/light wood. Why can’t that whole background be one image? Then you’d simply need two inner children elements side by side, instead of 6 elements, all different slices of images.

6

I think you’ll laugh. Because my stuff is so complex, I’m not surprised that you thought the wood was composed of a few images. Actually, it’s just one image, but I’m going to try your interesting idea of the subcontainers.

Thanks!

7

I just saw you had 6 containers, or something like that. Adjacent children, is probably the better term… It’s not really all that complex; I just see you have a lot more HTML than what is needed.

8

OK! Live and learn! That’s what I need around here. :smile:

1 Like
9

Hi there daveg,

check out the attachment, it may possibly suit your requirements…

daveg.zip (321.4 KB)

…or not. :grimacing:

coothead

10

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.