Problems with a div (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets and Accessibility



Message

SyberAngel -> Problems with a div (2/12/2005 9:02:01)

I have a blog and I've noticed how it shows up differently in different browsers. I'm used to seing that pages don't act the same in Firefox and Internet Explorer, but this is a big difference.
Somehow the page in IE is missing one whole div, but Firefox shows it. I've always had problems with this div and don't know what to do to solve it.
Here is the example of the page in Firefox: EXAMPLE
And here an example in Internet Explorer: EXAMPLE

You can find the blog by clicking HERE. The source of the page is able to be seen by right-click, View Source.
Structure of the div is found in the source under Page Structure division. It is called "quote".


Any help and suggestions on this one will be quite helpful.
Thanks!!

Btw. how do you like the design?



jaybee -> RE: Problems with a div (2/12/2005 10:40:46)

Welcome to OF. The design is very nice.

On a quick look I think you'll find your problem is due to the fact that you're using the images as backgrounds. IE sees the quote div as being empty and appears to be either ignoring it or floating it up under the header.

Try putting the image in the div instead of defining it as a background in the css.



SyberAngel -> RE: Problems with a div (2/12/2005 11:17:21)

I don't think that's the case. Or maybe it is in a way. This problematic div used to be a div just like all the rest of them containing some quotes. And I remember IE was revolting even at that time.
I'll try your solution anyway. Every advice is better than having no advice ;)

Btw. Hello to everyone at OF and thanks for welcoming me :)



SyberAngel -> RE: Problems with a div (2/12/2005 11:46:36)

Fixed the problem. But not the way you suggested. I was just experimenting a bit and came up with the solution. The div not showing properly in IE had nothing to do with me using a picture for the div's background.

Here's what I did:

- This was the original code:
<!-- Begin Random quote generator --!>
<div id="quote"></div>

- I replaced it with:
<div id="quote" align="center"></div>

I gave it an alignment attribute just in case, but it works without it just as well.
I guess IE couldn't cope with my comment :-/ No, wait, I see the problem... Of course it didn't cope with the comment since I made two exclamations in it. Poor thing was confused ;) Problem solved :)

One more reason to use Firefox ;)



jaybee -> RE: Problems with a div (2/12/2005 13:24:15)

DuH!

You know I saw that the comment line was wrong and it just didn't register.

I've been staring at this php code for too long.

Glad you're sorted.

Just a tip though. Using pics as backgrounds can cause problems especially if you have fluid layouts and you shrink the screen size. Then divs will tend to cover each other up. If in doubt, shove the picture in the div. I spent ages figuring one of those out.



SyberAngel -> RE: Problems with a div (2/12/2005 13:38:23)

Hehe, I never registered that flaw in the comment line until now. I dreamt about taking away the comment line at nigt yesterday. I guess deep down inside I know it was the problem.

Thanks for the tip. I never had a picture in a div as a background before, but I did have a fluid design. I guess Now I'll finally be able to solve the unsolvable mystery on one of my other pages :) Thanks again.



Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
6.201172E-02