/    Sign up×
Community /Pin to ProfileBookmark

IE ridiculousness…

I am having an issue with IE 7 and this page I created: [url]http://vaccinationfaq.org/diseases.html[/url]

It’s a little hard to explain what is happening but here goes… when I visit this page, usually with a fresh browser, the images overlap the text. After a few seconds or a refresh, the images pop into place. The behavior is unpredictable and I am still trying to work out what specifically causes the images to first be in the proper position and then not.

At first I thought it was something to do with the IE developer toolbar, because when I would run the toolbar, the pictures popped into place. But now I have noticed the behavior without it.

So if anyone out there can check the page with IE 7 and tell me if they get the same behavior that would be awesome!!

to post a comment
CSS

7 Comments(s)

Copy linkTweet thisAlerts:
@catskinOct 30.2008 — Hi,

This is a total pain in the but and working it out is like hitting your head against bricks but it's actually really simple to fix...

For IE's box model to work your css class "subColumn1" needs to have a width set so that its kids know how to behave themselves.... try something like this:

[CODE]#subColumn1 {width:575px; position:relative; background-color: white; margin:0 30px 30px 156px; padding:1px 39px 30px 39px; }[/CODE]
Copy linkTweet thisAlerts:
@CoyotelabOct 30.2008 — Replace:
[code=html]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
[/code]
with:[CODE]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
[/CODE]
that might help.
Copy linkTweet thisAlerts:
@notJustinOct 30.2008 — It's probably just me, but I'm using IE 6 and none of the text in the body shows up. Just the pictures. FireFox, Safari, and Chrome looks great. Maybe someone else with IE 6 will pitch in how it works for them.

Hopefully Coyotelabs suggestion of changing from strict will do the trick.

The main thing I wanted to say is I like the layout of the page and the code. I want to learn using divs someday and I have bookmarked your page as a 'study guide'.

Nice work.
Copy linkTweet thisAlerts:
@WebJoelOct 30.2008 — ....I want to learn using divs someday and I have bookmarked your page as a 'study guide'.[/QUOTE] A good 'study guide' is to go to strangebanana.com and create a dozen or two their D-HTML programically-generated templates... learn from those. Bend 'em, break 'em, fix 'em... can't fix 'em? -Get some more! These are created 'new, never-seen before' randomly. And while 9 or 10 of them look like heck, every so often you get one that is mildly un-repulsive... learn from this what makes what work, etc...

(&, sorry to hijack but could not resist...)
Copy linkTweet thisAlerts:
@digitaldervishauthorOct 30.2008 — It's probably just me, but I'm using IE 6 and none of the text in the body shows up. Just the pictures. FireFox, Safari, and Chrome looks great. Maybe someone else with IE 6 will pitch in how it works for them.

Hopefully Coyotelabs suggestion of changing from strict will do the trick.

The main thing I wanted to say is I like the layout of the page and the code. I want to learn using divs someday and I have bookmarked your page as a 'study guide'.

Nice work.[/QUOTE]

Thanks notJustin, it's cool to hear some positive feedback. As for IE 6... yeah I noticed that the site totally breaks in IE 6. I like coding for a standards compliant browser like firefox first, then I do any necessary IE 7 hacks, then finally I work on IE 6 hacks. So the site is still in progress.
Copy linkTweet thisAlerts:
@catskinOct 30.2008 — Hi,

So, did setting the width of #subColumn1 work for you digitaldervish?

Just keen to know as it sure worked for me...
Copy linkTweet thisAlerts:
@digitaldervishauthorOct 30.2008 — No, the width didn't work entirely... took a while to calculate what the width should be... the result is online... the box now sits against the left edge. I think I can see a solution using top: and left: for the relative positioning. It would be a lot easier to troubleshoot if IE behaved consistently. Anyway... I think like Coyotelab said... changing the doctype would probably fix a lot of things. But I feel like that is the lazy way out. I like programming for a strict doctype because that is the way the web is supposed to work dammit!

Anyway, I may be singing a different tune after I bash my head against this problem for a day or two.
×

Success!

Help @digitaldervish spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...