Jump to content

Recommended Posts

Hello all,

 

I`m just creating a simple website for my friend, now done just with basic template how it will look. When i see it in Firefox - everything is ok, but in IE ... omg it hurts my eyes ! ;(

 

Check this out , and please, any tips ? http://mpersonal.puslapiai.lt/

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/
Share on other sites

Well, quite some people hate IE, because they have no idea what they are doing. Not saying that that's the case here, but your markup is missing something vital

 

And that's a doctype, this makes IE to go back to IE 5 isn't that great!

 

See my signature....5 out of 10 this is the cause of browser differences ;D So it's not IE it's you as coder that should supply a doctype.

Anyway i like the looks of your site, nice black white and red  great all time combo

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/#findComment-1189423
Share on other sites

so in otherwords place a doctype above the <html>tag

 

Typical usage:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
            "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    ...
    </head>
    <body>
    ...
    </body>
    </html>

 

also make sure it's at the first line and there is no space at the left of that doctype.

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/#findComment-1189427
Share on other sites

Sometimes IE is more forgving, I looked at it in firebug and looked at the css, nothing stood out to me. Try the doc type thing and see what happens.

 

IE does not forgive omitting a doctype! and it shouldn't.

this is typical the case here. Your page is not centered in IE, because of omitting the doctype. it now interprets the page as if it were IE 5. And for centering in IE 5 we need text-align:center; and not margin :0 auto;

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/#findComment-1189438
Share on other sites

Thx all of You ! Now I won`t ever forget a doctype ! but..

 

When i added it it helped about centering, but now new strange things appeared:

 

Firefox changes:

  • Home page missing left column
  • Some other pages missing footer and comment is showing  :confused:

 

IE changes:

  • Galerija page missing image

 

About missing column i tried to make that div wider but it didn`t worked.. :)

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/#findComment-1189462
Share on other sites

ah good to hear that worked out.

Now what i would do is place a reset.css above your existing css. This will screw up some things at the beginning, but it will make sure that most other browser differences are gone. You can find one here, i use it myself: http://meyerweb.com/eric/tools/css/reset/.

in a nutshell, it will reset the differences most browsers have. after that you can easily style elements yourself. More info can be found here

 

Now something to pay attention to is that IE 6 has a margin bug on floated elements, to eliminate that you can say display:inline to anything that is floated (easiest to remember way).

 

After you have done that, let me know, what version you see weird stuff and we will fix it. ::)

 

also, i haven't looked, but images require an alt="" tag in the declaration, so don't forget that.

If you use a background image, make sure if you use no-repeat that there is a space between no-repeat and the url(image.jpg)

like:

#element{
  background: #000 url(../images/image.jpg) no-repeat;
}

instead of

#element{
  background: #000 url(../images/image.jpg)no-repeat;
}

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/#findComment-1189464
Share on other sites

Acording to Firefox you have your main div commented out.

 

You have  <!---- END side --->  Not <!-- END side --> and it's the same with some of the others. It's two dashes not anymore.

 

Back in the day if you typed <!--END side --> in fire fox with no space between the dash and the E in END it would mess it up. I would spend a day looking for the cause of my problem. I don't think firefox is that picky any more but I still make sure I use two dashes and a space.

 

Noting your tags on divs is a good idea on the big ones and on big files (for people like me anyway).

 

 

 

 

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/#findComment-1189466
Share on other sites

Well guys what I can say, THX ! really, a lot ! You`re so helpful and not angry at me :P

 

well the footer was missing because i was using <!---- comment ----> for my comments, now i fixed it to <!-- comment --> and it works fine !

and my image in IE was missing because I forget to write slash at the end of img line:

 

<img id='greta' src='$image_folder/$image_name' alt='$image_name'/>

 

And yes, that thing with CSS reset is cool, thx for sharing it !

 

Big thx!  ;)

 

Try look now in both IE and Firefox, looks cool :) well maybe design is crap but it works !

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/#findComment-1189470
Share on other sites

your design looks good enough! black white and red are great.

 

Just for your next project, start of with a valid doctype and a reset.css than design the website for firebug (gecko) and adjust it with conditional comments for specific versions of IE. Oh And I can also recommend to use <h1><h2><h3> elements for your headings. indexing bots love em ::)

 

good luck!

Link to comment
https://forums.phpfreaks.com/topic/231076-how-i-hate-ie/#findComment-1189471
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.