Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 14 of 14
  1. #1
    New to the CF scene
    Join Date
    Nov 2009
    Location
    Ararat, VA
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Web design fine in IE, but a mess in FireFox

    http://cedarhillapts.com/
    http://www.hidenwoodapts.com/cedarhi.../cha-style.css

    Both html and css validate.

    Looks as intended in IE7. Is a total mess in Firefox 3.0.15.

    This page is too simple to be this messed up! I've gone over (and over) the code and it all makes sense to me. I guess I'm just too close to it.

    In short, a div with a graphic starts the rounded box/container for the page. The main div has a graphic that creates the edges on each side. A third division contains the graphic for the bottom of the rounded box.

    In the main division, I have two divisions, floated left, one contains the basic content and the other contains the navigation buttons.

    The footer comes from an _includes and is under the three divisions that make up the rounded box. That's it.

    Please help me save what little hair I have left. This code is making me pull it out.
    Attached Files Attached Files

  • #2
    Senior Coder
    Join Date
    Oct 2005
    Posts
    1,340
    Thanks
    0
    Thanked 61 Times in 60 Posts
    IE may be showing what you want but Firefox is showing what you wrote. You will never get IE to attempt to perform like other far more modern browsers, such as Firefox, without a proper doctype. Use this one:

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

    Then adjust your markup so it works in Firefox first. Then we can hack iE for its multitude of bugs and quirks.

  • #3
    New Coder
    Join Date
    May 2009
    Location
    philippines
    Posts
    50
    Thanks
    6
    Thanked 1 Time in 1 Post
    just to add..
    you can also use

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    to force validators to evaluate your (x)html codes a little bit more strictly to conform to the later browser versions.

    it'll be good practice too, to test your codes in as many different browsers as practicable and apply any hacks or fixes to those that need it (use either hacks or using additional/different css codes). i know it's a lot more work to do but it's the price for getting a very stable and cross-browser compatible website/webpage that looks the same whichever browser a user use.

    i strongly agree with drhowarddrfine to use firefox first to work on your webpages and then fix the bugs when using other browsers..

  • #4
    Senior Coder
    Join Date
    Oct 2005
    Posts
    1,340
    Thanks
    0
    Thanked 61 Times in 60 Posts
    Quote Originally Posted by sim_pack View Post
    just to add..
    you can also use

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    to force validators to evaluate your (x)html codes a little bit more strictly to conform to the later browser versions.
    No. First, she's not using XHTML syntax and, second, she's not serving it as XHTML. In addition, no new web pages should ever us the transitional doctype. New pages should always use the strict doctype.

  • #5
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    Quote Originally Posted by drhowarddrfine View Post
    Use this one:

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    Unless you're using a generic SGML validator or trying to be compatible with very old browsers, I would just omit the system identifier (i.e., URL). It's cleaner and reduces the DOCTYPE declaration to something that can actually be memorized.

    Code:
    <!doctype html public "-//W3C//DTD HTML 4.01//EN">
    Quote Originally Posted by sim_pack View Post
    to force validators to evaluate your (x)html codes a little bit more strictly to conform to the later browser versions.
    I always find these nonsensical statements amusing. (I last read one in a school text book that was supposed to be teaching XHTML.) What does "conform to the later browser versions" even mean? To date, no version of Windows Internet Explorer even supports XHTML.

    It's also a bit funny to use a "transitional" DTD when you're trying to use the strictest, latest, and greatest language.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #6
    Senior Coder
    Join Date
    Oct 2005
    Posts
    1,340
    Thanks
    0
    Thanked 61 Times in 60 Posts
    Quote Originally Posted by Arbitrator View Post
    Unless you're using a generic SGML validator or trying to be compatible with very old browsers
    I'll repeat what I said. New web pages have no business using anything but a strict doctype and trying to be compatible with older browsers is never any excuse.

  • #7
    Regular Coder
    Join Date
    May 2009
    Posts
    143
    Thanks
    14
    Thanked 1 Time in 1 Post
    Sorry to differ drhowarddrfine, But some companies have us support those older browsers.. I have managed to fight for the removal of IE6 support but not everyone have those cool boss

  • #8
    Senior Coder
    Join Date
    Oct 2005
    Posts
    1,340
    Thanks
    0
    Thanked 61 Times in 60 Posts
    Quote Originally Posted by Arbitrator View Post
    I would just omit the system identifier (i.e., URL). It's cleaner and reduces the DOCTYPE declaration to something that can actually be memorized.

    Code:
    <!doctype html public "-//W3C//DTD HTML 4.01//EN">
    You can do that, and I keep forgetting about it, but it's incorrect because case matters in the doctype:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

    But who memorizes such things? If you're going to do that, you might as well go with the HTML5 doctype: <!doctype html> Case does not matter there, it's far simpler to memorize, and it's case insensitive.

  • #9
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    Quote Originally Posted by drhowarddrfine View Post
    I'll repeat what I said. New web pages have no business using anything but a strict doctype and trying to be compatible with older browsers is never any excuse.
    I'm a bit of a loss as to what you are trying to convey. The reduced declaration is still for HTML 4.01 Strict. The reduced declaration is not being used for compatibility either; I was saying that you would be sacrificing compatibility: I believe it puts an older version of Konquerer in quirks mode (IIRC). It wouldn't surprise me if no one in this thread was testing against that browser anyway.

    Quote Originally Posted by drhowarddrfine View Post
    You can do that, and I keep forgetting about it, but it's incorrect because case matters in the doctype:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
    In HTML 4.01, the declaration in case-insensitive except for the public identifier string (i.e., -//W3C//DTD HTML 4.0//EN) and, perhaps, the system identifier depending on the server it points to. This is my understanding anyway; I tried finding a definitive source for this awhile back but wasn't able to find one in the HTML 4.01 spec. The SGML spec is a for-pay spec, so I couldn't check that.

    In XML, the keywords DOCTYPE, PUBLIC, and SYSTEM are case-sensitive uppercase while the root element name must case-sensitively match that of the used root element.

    In XHTML, element names are case-sensitive lowercase, so HTML would have to be html. This is an HTML declaration though, so the case doesn't matter.

    (I guess there was typo there since you referenced HTML 4.0.)

    Quote Originally Posted by drhowarddrfine View Post
    But who memorizes such things?
    People that want to write code by hand quickly. It also becomes significantly easier to memorize once you understand why the odd-looking public ID is the way it is.

    Quote Originally Posted by drhowarddrfine View Post
    If you're going to do that, you might as well go with the HTML5 doctype: <!doctype html> Case does not matter there, it's far simpler to memorize, and it's case insensitive.
    That depends. Do you want to write an HTML 5 document or an HTML 4.01 document? Since I haven't yet memorized the rules for HTML5 documents (whose spec is still in flux anyway), I'd rather stick with HTML 4.01 for now. I imagine that the OP isn't familiar with HTML5 either, though you sound as if you are.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #10
    Senior Coder
    Join Date
    Oct 2005
    Posts
    1,340
    Thanks
    0
    Thanked 61 Times in 60 Posts
    Quote Originally Posted by Arbitrator View Post
    I'm a bit of a loss as to what you are trying to convey. The reduced declaration is still for HTML 4.01 Strict.
    I don't know either. I might have mixed up the posts.
    That depends. Do you want to write an HTML 5 document or an HTML 4.01 document? Since I haven't yet memorized the rules for HTML5 documents (whose spec is still in flux anyway), I'd rather stick with HTML 4.01 for now. I imagine that the OP isn't familiar with HTML5 either, though you sound as if you are.
    Notice there is no version number in the "html5" doctype. All browsers will go into standards mode using it.

  • #11
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    Quote Originally Posted by drhowarddrfine View Post
    Notice there is no version number in the "html5" doctype. All browsers will go into standards mode using it.
    Right. The point was that you cannot write a conforming HTML 4.01 document using <!doctype html> per HTML 4.01 Section 7.2.

    Interestingly, after reading that, I find that it's unclear as to whether the URL is required or whether the declaration keywords and root element name must be capitalized though. It says you "must" use the listed declarations (which are in uppercase and include a URL), but the code for the spec's own source code violates the literal text and omits the URL. Likewise, the W3C's recommended DTD list violates the literal case-sensitivity requirement. How confusing.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #12
    Senior Coder
    Join Date
    Oct 2005
    Posts
    1,340
    Thanks
    0
    Thanked 61 Times in 60 Posts
    Quote Originally Posted by Arbitrator View Post
    Right. The point was that you cannot write a conforming HTML 4.01 document using <!doctype html> per HTML 4.01 Section 7.2.
    Because that declaration did not exist when the spec was written but all the browsers recognize <!doctype html> the same way. Scroll to the bottom of this.

  • #13
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,300
    Thanks
    28
    Thanked 275 Times in 269 Posts
    Quote Originally Posted by drhowarddrfine View Post
    Because that declaration did not exist when the spec was written but all the browsers recognize <!doctype html> the same way.
    It did exist, but it's still not correct HTML 4.01.

    Quote Originally Posted by drhowarddrfine View Post
    Scroll to the bottom of this.
    I've read that article (years ago). I don't see what point you're trying to convey though.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #14
    Senior Coder
    Join Date
    Oct 2005
    Posts
    1,340
    Thanks
    0
    Thanked 61 Times in 60 Posts
    We mustn't be talking about the same thing so I'm going to bed early tonight.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •