IE, FF and Opera driving me nuts

[PulseDriver]

I am making a webpage, a page for some of my friends which I play a game called Second Life with, but no matter. Everyone knows that the browsers displays stuff different, and IE is far into the plains when it comes to following the Document Object Model.

I my case, I am having trouble cause I use borders.

If you look at my page http://www.tempus-web.net/ and look at the menu to the left, and do so with Firefox and Opera, they are almost similar, but if you open this page with Internet Explorer, you'll see the Document Object Model here is very different, and it makes my menu very narrow.

I am wondering, is there any model which makes them appear almost the same, a hack or trick which makes it look similar with IE, FF and Opera?

Hate to bug you for this, and to those who think I spam, this page have no commercial content at all. It's plainly for my Second Life friends.

--

And I forgot the current stylesheet. Called Asylum located http://www.tempus-web.net/style/asylum.css so you don't have to do source-digging to help me.

[Vodoc]

http://www.google.com/search?q=box+model+hack

[zootm]

Vodoc's advice is likely to be helpful, yeah. I don't know what the specific problem is, but you should note that the problem is not with the Document Object Model, it's with IE's Box Model. The DOM is something completely different.

[ryan]

If you put a . before a property in your stylesheet, you can set a different value for IE.

Something like..

code:


background-color: #000;

.background-color: #fff;

Atleast if I'm remembering correctly.

[Mattress]

Looks okay in IE for me.

Here's a tip for getting stuff to work pretty similarly across browsers. Use tables for layout. Sure it sucks because you're not supposed to use tables for layout, but when it comes down to a choice between what actually works and 'the propery way' of writing html code. I'll take what works. Sorry web standards project...

[Omega X]

Originally posted by Mattress
Looks okay in IE for me.

Here's a tip for getting stuff to work pretty similarly across browsers. Use tables for layout. Sure it sucks because you're not supposed to use tables for layout, but when it comes down to a choice between what actually works and 'the propery way' of writing html code. I'll take what works. Sorry web standards project...

As far as I'm concerned, tables are fair play. Phuck Web standards project. Interoperability overweights some silly standards group.

[xzxzzx]

Originally posted by Omega X
As far as I'm concerned, tables are fair play. Phuck Web standards project. Interoperability overweights some silly standards group.

I officially hate you.

I'd like to point out that web standards are why interoperability exists at all. People like you are exactly why IE doesn't support standards, and why people like me have to work so hard to get websites which work with IE, and why there is any problem with interoperability in the first place.

...

Oh, and:

Originally posted by Mattress
Here's a tip for getting stuff to work pretty similarly across browsers. Use tables for layout. Sure it sucks because you're not supposed to use tables for layout, but when it comes down to a choice between what actually works and 'the propery way' of writing html code. I'll take what works. Sorry web standards project...

I officially hate you, too. For the same reasons.

[Mattress]

Don't hate me, hate IE, it's developers and it's many users.

People like me aren't the reason IE doesn't support standards. If you want to blame someone blame Microsoft and partially Netscape.

At least I use proper markup. Sorry if I use tables for layout. What's the big difference really? It's either messy HTML or messy CSS. The mess still exists, we just moved it to a different room of the house.

FYI for my personal sites (where I actually care and have the time to spend messing with it forever) I use CSS based layouts. At work, when shit needs to work right away, tables work right away.

[shakey_snake]

Originally posted by Mattress
Don't hate me, hate IE, it's developers and it's many users.

People like me aren't the reason IE doesn't support standards. If you want to blame someone blame Microsoft and partially Netscape.

Your apathy and mediocrity aren't helping the situation. That's why we blame you for this.

[Mattress]

My need to get things done on budget and on deadline require me to be apathetic when it comes to web standards.

I'd rather eat and have a place to live than follow web standards. Sorry for my lack of conviction and my unwillingness to die for the cause.

[mysterious_w]

2nd life? I heard that mentioned on a podcast I listen to yesterday.

Apprantely it was designed to be an mmorpg sims, but now everyone just uses it for cyberfucking.

I'll stick with regular porn.

[Mattress]

I read a few articles about that game in The Escapist it intrigues me, apparently the vampire people don't like it when your naked gay troll with detachable penises crashes their rave...

[siebe83]

Originally posted by Mattress
Don't hate me, hate IE, it's developers and it's many users.

People like me aren't the reason IE doesn't support standards. If you want to blame someone blame Microsoft and partially Netscape.

At least I use proper markup. Sorry if I use tables for layout. What's the big difference really? It's either messy HTML or messy CSS. The mess still exists, we just moved it to a different room of the house.

FYI for my personal sites (where I actually care and have the time to spend messing with it forever) I use CSS based layouts. At work, when shit needs to work right away, tables work right away.

<3

That's what it's all about. Does it work or not.
CSS isn't perfect either.

I don't see how using tables would cause IE not to obey web standards.

[ryan]

I'm not even going to join into this argument. I've stated my opinion many times before.

Just look to your left for my opinion

[zootm]

Tables for layout breaks mobile devices, and various other things. It's just not a good way forward.

[PulseDriver]

I fixed it with a hack. Probably not 100% safe, but the0.1% which uses IE and knows it professinally enough to force certain criterias will have to sit there and look dumb, anyway.

The hack is based on HTTP request browser by PHP, and by determaining that, choose to load an extra styleshit for IE. Um styleshit.. stylesheet for IE. Working good for now. But IE is teh h8, no doubt.

Thanks for your um eh.. table-discussion. If I went with tables, I wouldn't asked here, cause I never go that way again.

The hack you talk about Ryan don't go for all IE browser, meaning they've fixed the bug.

[cooky560]

looks fine to me in all 3

[PulseDriver]

Yeah, cause I I use a hack forcing IE to run another style than FF and Opera. I should not need to do that.

[cooky560]

no but we all know IE sucks donkey balls

[Wolfgang]

Using conditional comments is a much better and cleaner way to load an alternate IE-only stylesheet, in my opinion. You can direct them at any version of IE, or all of them, and any browser that isn't IE ignores them.

[PulseDriver]

That's not right Wolfgang. Some browsers can identify itself as internet explorer, anyway, it got additional parameters for it's own name and version, so it's possible to take this little info to get the real browsers name, but usually when it identifies itself as IE, the full version of the browser it really is, is lacking.

Anyway, yes, I determain by PHP what browser it is, and add an additional CSS to the markup. No other browsers have been able to make this statement true, so it works for now.

[Wolfgang]

PulseDriver, you don't understand. I know things like Opera include MSIE in their UA string, but conditional comments have nothing to do with the UA string. For example:

code:
<!--[if lte IE 6]><link rel="stylesheet" type="text/css" href="ie.css" /><![endif]-->

These will look like normal comments to most browsers. But they're specific to IE and IE only supports them. So everything except IE will ignore them. In the example above, only versions of IE less than or equal to 6 will use ieonly.css. So IE 7 will ignore it.

Browser sniffing with PHP is quite easy, but still a bit messy particularly because Opera can identify itself as Mozilla/IE/Opera (user's choice) and you can change the UA string in many Gecko-based browsers by some simple tinkering with the config. So if your intention is to target IE alone, conditional comments are the way forward.

[PulseDriver]

Yes, and that is what I do just doesn't show in the source cause it's done by PHP

If someone with Gecko want to tinker with that file to make it think it's IE, that's fine by me...

Highly doubt someone ever will though.. lol

[Wolfgang]

I'm not sure what you mean... conditional comments do show up in the source, they're part of the HTML if you decide to include them there.

Hmm, I dunno though, I have a small script that logs all the user agents that visit my site. Most are bots, IE6 and Firefox 1.0/1.5, but amongst all the others, there are people who think they're clever and have "Wouldn't you just love to know?" or "Fuck you" as their UA string. And while I don't give a shit whether my site displays all right for these people, conditional comments will still do the job correctly since they're unrelated to the UA string.

[PulseDriver]

Well, if they want to have "Fuck you" in their UA string, they will get the original content, like anyone else. It will pick up any other OA, as I have based the search for browsers as modern, so unless it's Internet Explorer, it will get the regular stylesheet. If it doesn't support stylesheet, it will look mostly like when you choose the "No style" in the styles menu.

And I don't use the IE comment, I use PHP get_browser

[InvisableMan]

When I'm working on a website, I code out what works, with no regard for standards, since as we all know, no mainstream browser really follows the standards anyways, so why should I take the effort to do so as well when it won't even work right?

[Omega X]

Originally posted by xzxzzx
I officially hate you.

You never did like me, so why should I care now...

[InvisableMan]

Noone likes me.

[PulseDriver]

Hum, another thing about IE, FF and Opera.

code:
I went to the Winamp forums to whine

is not the same as

code:
I went to the Winamp forums to whine

Where the ampersand (&) nbsp semi-colon (;) is reperesenting a space.

Is this true? When I use the float value on text towards the psuedo element:first-letter single character words like I and A will have the text floating all the way upon it, even if there is a regular space (not forced) placed after it. I hate have to adding (&)nbsp; after all articles I start with either I or A.

[xzxzzx]

Originally posted by Mattress
At least I use proper markup. Sorry if I use tables for layout. What's the big difference really? It's either messy HTML or messy CSS. The mess still exists, we just moved it to a different room of the house.

Well, when the mess is in the CSS, browsers which don't (or can't, due to limitations of the device they're on) understand CSS can still appropriately display the page, because you've removed the design from the content.

Originally posted by InvisableMan
When I'm working on a website, I code out what works, with no regard for standards, since as we all know, no mainstream browser really follows the standards anyways, so why should I take the effort to do so as well when it won't even work right?

It can work right, and Opera and Firefox and Safari and ... (well, any browser but IE) supports the standards pretty well.

Originally posted by Omega X
You never did like me, so why should I care now...

Because now I have a good reason to dislike you.

[edit]

Originally posted by PulseDriver
Is this true? When I use the float value on text towards the psuedo element:first-letter single character words like I and A will have the text floating all the way upon it, even if there is a regular space (not forced) placed after it. I hate have to adding (&)nbsp; after all articles I start with either I or A.

I don't understand what you're saying. Do you have an example of XHTML/CSS?[/edit]

[Mattress]

Originally posted by xzxzzx
Well, when the mess is in the CSS, browsers which don't (or can't, due to limitations of the device they're on) understand CSS can still appropriately display the page, because you've removed the design from the content.

eh, not exactly. here's my friend's site without the stylesheet

I'd be willing to wager that most browsers on wireless devices (phones, palm pilots, etc..) do understand stylesheets. What are some of the mobile devices that understand html but not css, anyone?

I'd also be willing to wager that people who still surf the net with Netscape 4.x or worse really don't understand what the internet is really about. I'm not going to worry about ruinging the experience for 0.0000001% of the audience (netscape 4.x, palm piltoers, etc..) as much as I am about ruining the experience for 95% of the audience (IE users).

[Omega X]

Originally posted by xzxzzx

Because now I have a good reason to dislike you.

And that means what really? Including hating me out of spite, you hate me also because Interoperability is wrong in your eyes?

Whether you hate it or not, it must be done. Otherwise you lose business. UNLESS you have a secret plan to force Microsoft to rewrite or fix Trident for Standards Compliance?

I can write compliant XHTML until the cows come home, but I still have to hack and alter for Microsoft's junk.

[PulseDriver]

I used & nbsp; char delimiter in the second example, not in the first. Anyway, do anyone have expertise using .procmail? I need to forward some emails through auto-forward to a PHP program on my website.

[ScorLibran]

Originally posted by InvisableMan
Noone likes me.

I do. Whether you want me to or not.

[PulseDriver]

:P

[InvisableMan]

Originally posted by ScorLibran
I do. Whether you want me to or not.

Are you a good snuggler?

[tuckerm]

Hand Check!

[xzxzzx]

Originally posted by Mattress
eh, not exactly. here's my friend's site without the stylesheet

That's almost what your friend's site looks like without CSS, except for the style attributes embedded into the HTML. Notice how readable and usable (if not pretty) it is. Also notice how the non-content images are embedded into the HTML with <img> tags...

See the attachment for what it would really look like (if properly designed, and without the style attributes).

Originally posted by Mattress
I'd be willing to wager that most browsers on wireless devices (phones, palm pilots, etc..) do understand stylesheets. What are some of the mobile devices that understand html but not css, anyone?

Pocket IE 2003 (for example) understands some CSS, yes. Which is a good reason to use it, not to avoid using it!

Try surfing around with this thing for a while:

http://www.opera.com/products/mobile/operamini/demo.dml

Or this:

http://www.delorie.com/web/wpbcv.html

Originally posted by Omega X
And that means what really? Including hating me out of spite, you hate me also because Interoperability is wrong in your eyes?

First, why do you assume that I hated you before? I just didn't like you.

Second, interoperability is exactly why I write in XHTML/CSS, instead of the very broken idea of using tables.

Originally posted by Omega X
I can write compliant XHTML until the cows come home, but I still have to hack and alter for Microsoft's junk.

Yes, that's true.

Originally posted by PulseDriver
I used & nbsp; char delimiter in the second example, not in the first.

Yes, I saw that. But what's the problem?

[Mattress]

so what happened to those images at the top on your screenshot? Or should I be setting those as backgrounds of divs or something?

[PulseDriver]

YEs mattress, you make <h1><span>About Plastic</span></h1> or whatever that image is saying and do

code:




h1 span{

  vibility: hidden;

}



or 



h1 span{

  display: none;

}



h1{

  background: white url(blablabla) no-repeat top right;

}



or whatever you wanted to do

Laters..