really really wierd IE rendering bug.
Moderator: General Moderators
-
Daisy Cutter
- Forum Commoner
- Posts: 75
- Joined: Sun Aug 01, 2004 9:51 am
really really wierd IE rendering bug.
Check this out in IE:
http://kafene.org/url/blog.php
it's my blog which is valid (as of now, and i know that doesnt garuntee compatibility but its a good way of getting it)...
if you open it in IE, the first post has no border at the top and is black for about 1/3 the way down. all other posts display just fine and the page displays right in konqueror, firefox and opera so i dont care. if you middle click and drag around a little with the white circle/arrow thing, it actually starts erasing/drawing on the divs! how BADLY coded can a browser get!?!!
also missing in IE are a dotted underline for my blog title, and the title is also oversized (i used an em within an em which should make it proportional to the first em, but ie treats it like it's not inside any other, and it cant used "dotted" in CSS).
http://kafene.org/url/blog.php
it's my blog which is valid (as of now, and i know that doesnt garuntee compatibility but its a good way of getting it)...
if you open it in IE, the first post has no border at the top and is black for about 1/3 the way down. all other posts display just fine and the page displays right in konqueror, firefox and opera so i dont care. if you middle click and drag around a little with the white circle/arrow thing, it actually starts erasing/drawing on the divs! how BADLY coded can a browser get!?!!
also missing in IE are a dotted underline for my blog title, and the title is also oversized (i used an em within an em which should make it proportional to the first em, but ie treats it like it's not inside any other, and it cant used "dotted" in CSS).
- no_memories
- Forum Contributor
- Posts: 145
- Joined: Sun Feb 01, 2004 7:12 pm
- Location: New York City
AS much as I dislike I.E. too, it is 80%+ of your audience.all other posts display just fine and the page displays right in konqueror, firefox and opera so i dont care.
Code: Select all
#main{
position:relative;
width:70%;left:0;
margin-left:25%;
top:20px;
}Code: Select all
#main{
width: auto; /* the auto value allows the margin rule to take over */
Margin: 20px auto 0 350px; /* the 350px is how far left this <div> would be and the auto allows the margin to auto adjust itself from the right. the 20px is your top margin, no top rule is needed. */
}This is the beginning of your problems, the CSS is as bad as it gets. I.E. is quirky to begin with but using a %value with a margin rule is bad.
Your <h> shouldn't use EM values either. uugg. In short, this needs to be done properly to cross browser correctly.
This problem could be solved, but it would involve changing the basic CSS structure of the blog itself; basically from the ground up on the front end side. I'm guessing it uses a template system and whoever made it didn't really understand CSS all that well to make it cross browser compatible.
If you really want to make it right, you can either redo the template or get someone who knows how.
-
Daisy Cutter
- Forum Commoner
- Posts: 75
- Joined: Sun Aug 01, 2004 9:51 am
actually opera (myselfno_memories wrote:AS much as I dislike I.E. too, it is 80%+ of your audience.all other posts display just fine and the page displays right in konqueror, firefox and opera so i dont care.
A better cross browser way might look like - assuming you have a fixed width structure: one <div> or the other must be defined as a fixed width to get the other to expand and contract properly.Code: Select all
#main{ position:relative; width:70%;left:0; margin-left:25%; top:20px; }
Each preceding div would need to correspond with the margin values from hence forth. This is a very common misconception when it comes to CSS, the margin rule and how it works.Code: Select all
#main{ width: auto; /* the auto value allows the margin rule to take over */ Margin: 20px auto 0 350px; /* the 350px is how far left this <div> would be and the auto allows the margin to auto adjust itself from the right. the 20px is your top margin, no top rule is needed. */ }
This is the beginning of your problems, the CSS is as bad as it gets. I.E. is quirky to begin with but using a %value with a margin rule is bad.
Your <h> shouldn't use EM values either. uugg. In short, this needs to be done properly to cross browser correctly.
This problem could be solved, but it would involve changing the basic CSS structure of the blog itself; basically from the ground up on the front end side. I'm guessing it uses a template system and whoever made it didn't really understand CSS all that well to make it cross browser compatible.
If you really want to make it right, you can either redo the template or get someone who knows how.
To be fair if I were a web designer designing for a client, my page would work just fine in other browsers, and I'd probably have spent more than an hour learning CSS. CSS took me an hour to learn, HTML a few days and XHTML about 2 days.
OH BY THE WAY:
I must give you credit, simply changing main to width auto and adding a right margin of 10% fixed the IE bug. Strange little bug it was. Thanks a bunch!
- no_memories
- Forum Contributor
- Posts: 145
- Joined: Sun Feb 01, 2004 7:12 pm
- Location: New York City
Sticks foot into mouth <---
Well, I was assuming you weren't in northern Europe, which I'm guessing you are since Opera is 50% of your readers. And yes, Opera 7 screams just as Mozilla and KDE do when it comes to standards.
But when it comes to CSS, it may take only a little time to learn, but like the game of chess, it takes some time to master, especially when delving into complex sites.
Glad that little margin thing helped however.
onto the next CSS question 
edited: I.E. doesn't show the border: dotted rule; only dashed and solid I'm pretty sure. Let's give Microsoft a standing ovation for dragging the Internet down as NS4 did a few years ago by not advancing their browser any further - making us wait until their next OS comes out. Or we could all flood their filthy rich ambassadors with e-mails asking them, please fix your browser bugs for the betterment of the Internet, lol, like they would even open such e-mails, let alone read them.
Well, I was assuming you weren't in northern Europe, which I'm guessing you are since Opera is 50% of your readers. And yes, Opera 7 screams just as Mozilla and KDE do when it comes to standards.
But when it comes to CSS, it may take only a little time to learn, but like the game of chess, it takes some time to master, especially when delving into complex sites.
Glad that little margin thing helped however.
edited: I.E. doesn't show the border: dotted rule; only dashed and solid I'm pretty sure. Let's give Microsoft a standing ovation for dragging the Internet down as NS4 did a few years ago by not advancing their browser any further - making us wait until their next OS comes out. Or we could all flood their filthy rich ambassadors with e-mails asking them, please fix your browser bugs for the betterment of the Internet, lol, like they would even open such e-mails, let alone read them.
A combination of three things will push things along:no_memories wrote:I.E. doesn't show the border: dotted rule; only dashed and solid I'm pretty sure. Let's give Microsoft a standing ovation for dragging the Internet down as NS4 did a few years ago by not advancing their browser any further - making us wait until their next OS comes out. Or we could all flood their filthy rich ambassadors with e-mails asking them, please fix your browser bugs for the betterment of the Internet, lol, like they would even open such e-mails, let alone read them.
- Design to standards always, and if you end up with a MINOR/workable bug in IE, put a special note at the top of the page for IE users explaining why - this will encourage users to try alternatives.
- More market share has to slip to the alternative browsers - OEM's (Dell, HP), online services (Earthlink), and other people putting together software packages will speed this process, as Apple did by making Safari.
- Whenever you encounter sites that dont work properly in alternative browsers, notify the alternative browsers via bug reports (Mozilla, Konq, and Safari all have "evangalism" as a bug target), and notify the site that they won't get your business unless they support alternatives to a convicted monopolist, or at least support standards - this will encourage businesses to make the change as well.
Microsoft is huge, and since the current US administration was unwilling to break their stranglehold on computing, we as a computing society have to do it step-by-step, piece-by-piece, through grassroutes campaigns.
- no_memories
- Forum Contributor
- Posts: 145
- Joined: Sun Feb 01, 2004 7:12 pm
- Location: New York City
One such initiative is http://www.spreadfirefox.com/Roja wrote:Microsoft is huge, and since the current US administration was unwilling to break their stranglehold on computing, we as a computing society have to do it step-by-step, piece-by-piece, through grassroutes campaigns.
- mudkicker
- Forum Contributor
- Posts: 479
- Joined: Wed Jul 09, 2003 6:11 pm
- Location: Istanbul, TR
- Contact:
wowpatrikG wrote:One such initiative is http://www.spreadfirefox.com/Roja wrote:Microsoft is huge, and since the current US administration was unwilling to break their stranglehold on computing, we as a computing society have to do it step-by-step, piece-by-piece, through grassroutes campaigns.
http://www.spreadfirefox.com/?q=affiliates&id=21251&t=1