Help - Search - Members - Calendar
Full Version: Internet Explorer
HTMLHelp Forums > Web Authoring > Markup (HTML, XHTML, XML)
freakyfreaky
Okay, I know this is probably a very common problem, since IE sucks ass, but my website doesn't show up right in Internet Explorer.

Before I link you to my page, let me tell you that I apologize if this is in the wrong section (my page is set up with css), and also I apologize if this is a stupid mistake. I'm a stupid teenager who just wants to have a nice website, on which I can express myself, accessible to anyone who wants to look at it, even if they have a sucky web broswer.

Not that anyone would want to look at my website.

But whatever, let me stop wasting your time.

My website shows up PERFECTLY in SeaMonkey, Opera and Firefox. However, in IE, only one of the div's shows up, and it's not the right size OR in the right position.

The webpage is freakyfreaky.org/home.php

The header is /header.php

Annnnddd... the stylesheet is /styles.css.

Any help anybody has is GREATLY appreciated. biggrin.gif

Forgive me if I left anything out. Let me know what you need to know, and I'll give you the info ASAP.
pandy
Well, to start with the lack of a doctype puts browsers in Quirks Mode. Using one that triggers Standards Mode (AKA as Strict Mode) will fix the centering problem.

http://htmlhelp.com/tools/validator/doctype.html
http://hsivonen.iki.fi/doctype/


I'll see if I can find out why the menu is missing. smile.gif
pandy
The menu - get rid of 'position: absolute' in the rule for #navigation. Why did you use that?

CODE
#navigation {
    /* position: absolute; */
    width: 120px;
    float: left;
    margin-top: -15px;
    padding-left: 20px;
}


Haven't figured out what causes the gray at the sides yet.

Once you have a good doctype on, visit the validator (URL in the menu at top and bottom of this (or any other) page.

A word of advice, if you don't mind. Don't use DIVs for everything. Use them only for grouping things together and only if needed. Use proper elements that describe their content. H1, H2, H3 and so on for headings, P for paragraphs and so on.

Also, don't use XHTML slashes if you don't write XHTM (<br />). If you use P, you won't have to fake it with BR anyway. happy.gif
pandy
OK, the gray comes from this background image.
http://www.freakyfreaky.org/images/spring_fill.png

IE before, I think, version 7 doesn't support alpha transparency. I don't see why that image needs it anyway. Make it a 256 colors PNG or a GIF. Both support only single color full transparency. Or maybe you could just cut the transparent end bits off and position the background instead.

Done! tongue.gif
freakyfreaky
Thanks for your help!

I picked one of the doctype things, and fixed the properties for the navigation (and the content div, as well; I had added the absolute position thing because without it, the divs would go all crazy) and it ended up looking allright.

I validated it, and other than a bunch of stuff about those <br /> things and my bullets, it didn't give me any erorrs.

To be clear, <br> is okay, just not <br />? Because cutenews automatically makes it <br />. Is there any way to change it, do you know?

I'm loading photoshop to change the image. I had made it transparent because I wanted to add a patterned background, and I hadn't designed a layout in so long I forgot all the rules of good design. Not that I went to design school or anything. But you know what I mean.

Oh, when I checked the page out in IE, the divs were in the right place, but the pictures didn't show up. :/
Darin McGrew
QUOTE
To be clear, <br> is okay, just not <br />? Because cutenews automatically makes it <br />. Is there any way to change it, do you know?
Are you using HTML or XHTML? HTML uses <br> and XHTML uses <br />.
freakyfreaky
QUOTE(Darin McGrew @ May 12 2009, 07:16 PM) *

QUOTE
To be clear, <br> is okay, just not <br />? Because cutenews automatically makes it <br />. Is there any way to change it, do you know?
Are you using HTML or XHTML? HTML uses <br> and XHTML uses <br />.


Pretty sure it's HTML.

But, like I said, cutenews automatically changes it. :/
pandy
QUOTE
But, like I said, cutenews automatically changes it. :/


Bleh! They are also not OK because they are used to fake paragraphs where P should be used, slash or no slash.
freakyfreaky
QUOTE(pandy @ May 12 2009, 07:29 PM) *

QUOTE
But, like I said, cutenews automatically changes it. :/


Bleh! They are also not OK because they are used to fake paragraphs where P should be used, slash or no slash.


It just came to me... I'll just turn off the setting to change "new lines to <br />" and use <p> in the entry. =) That should solve the problem, right?

Ugh. Now I know why I set the headings to divs. I want them to be right next each other, with no space between them. How do I do that with just the regular headings? It does it automatically with divs.
pandy
QUOTE(freakyfreaky @ May 13 2009, 03:31 AM) *

Ugh. Now I know why I set the headings to divs. I want them to be right next each other, with no space between them. How do I do that with just the regular headings? It does it automatically with divs.


With CSS, of course. Set their margins to 0, at least the top and bottom ones. smile.gif
freakyfreaky
QUOTE(pandy @ May 12 2009, 07:49 PM) *

QUOTE(freakyfreaky @ May 13 2009, 03:31 AM) *

Ugh. Now I know why I set the headings to divs. I want them to be right next each other, with no space between them. How do I do that with just the regular headings? It does it automatically with divs.


With CSS, of course. Set their margins to 0, at least the top and bottom ones. smile.gif


Oh, duh. I was wondering why it wasn't working. I set the bottom one, but not the top for the h2 and h3.

I'll do that tomorrow. biggrin.gif

But both my CSS and HTML validate anyway. biggrin.gif I feel so proud. I'm adding those little icons to my page. lmao.

Thanks for all your help. happy.gif
pandy
QUOTE(freakyfreaky @ May 13 2009, 03:07 AM) *

I validated it, and other than a bunch of stuff about those <br /> things and my bullets, it didn't give me any erorrs.


The bullets are in the so called illegal range of the Windows codepage. See here what to replace them with.
http://www.htmlhelp.com/reference/html40/e...es/symbols.html
pandy
QUOTE
Oh, duh. I was wondering why it wasn't working. I set the bottom one, but not the top for the h2 and h3.


You should be aware that while all browsers use default margins for P and headings, as well as for some other block level elements, they don't do it the same way. Just because there isn't, say, a top margin in your browser there could be one in another browser. Because of that it's always best to control both top and bottom margins even it happens to look OK in the browser you are using at the time. If you start to fiddle with it, do it full out. It's you or the browsers. There is no middle way. At least not a reliable one. tongue.gif
freakyfreaky
okay, so everything's valid now, but now the layout image isn't showing up in IE.
pandy
Which one is that? Looks the same in IE and gecko AFAICS.
freakyfreaky
QUOTE(pandy @ May 13 2009, 06:28 AM) *

Which one is that? Looks the same in IE and gecko AFAICS.


I guess something is wrong with my copy of IE or something, because I tried at school today and it worked just fine. biggrin.gif

Thanks again for all your help.
pandy
Maybe you looked at a cached page, an old copy.
freakyfreaky
Okay, so now the site looks fine in all browsers, but the links in the navigation sidebar don't work in SeaMonkey or Firefox.

D:

Helppp!
pandy
Hmm, my fist guess is always that something is positioned on top of the links, but all positioning is gone AFAICS. blink.gif
pandy
First guesses are often right. Give #content a background color and you can see it covers the navigation. I'm still trying to figure out what you did to make it do that, but that won't happen until tomorrow if someone else doesn't step in. Zzzzzz...

Those BRs and DIVs are still there. Shame on you! tongue.gif
freakyfreaky
QUOTE(pandy @ May 14 2009, 09:10 PM) *

First guesses are often right. Give #content a background color and you can see it covers the navigation. I'm still trying to figure out what you did to make it do that, but that won't happen until tomorrow if someone else doesn't step in. Zzzzzz...

Those BRs and DIVs are still there. Shame on you! tongue.gif


Ugh. I suck. Does it have anything to do with the order they're in?

Idk. Help!?

lol. I"m too lazy to change all the DIVs to headers or whatever. And I thought I got rid of most of the BRs.

makin websites is hard.
pandy
Sorry, but you just removed my incentive. sad.gif
freakyfreaky
QUOTE(pandy @ May 15 2009, 05:23 PM) *

Sorry, but you just removed my incentive. sad.gif


huh what?

sorry?

I'll do whatever, just tell me what to do. lol.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2014 Invision Power Services, Inc.