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 13 of 13
  1. #1
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Website looks different on different browsers.

    My website bagonize.com looks great on all browsers (including internet explorer) yet does not work well at all on safari. Can anyone please tell me what is wrong? I'm assuming its just a line of code I'm missing. Thanks in advance!

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,105
    Thanks
    23
    Thanked 594 Times in 593 Posts
    When code appears differently on different browsers bad coding is suspect not a line of code. http://validator.w3.org shows 54 errors and 18 warnings. example </br> is not correct. the /> is not used with html5. You a number of <div> tags with no closing tags(A big error). Correct your code and see if things work a little better.

  • #3
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thanks for the reply sunfighter!

    I fixed the unclosed div errors and it did not affect anything. The other errors on the validator don't seem to be anything that could possibly affect layout.

    I also have noticed that it is the same problem on mobile phones.

  • #4
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,105
    Thanks
    23
    Thanked 594 Times in 593 Posts
    Maybe someone will come along and correct everything for you, but I won't look at the problem until the errors are fixed. My editor says there are 63 of them.
    I know a tag ending in /> will not cause your problems but how hard is it to do a replace /> with a >?
    How hard is it to add the end tag for <h4> and <a>? and can't we replace </br> with the correct tag?

  • #5
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello bagonize,
    The other errors on the validator don't seem to be anything that could possibly affect layout.


    Ok, that's probably not right. I think you may have some more things to fix...
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #6
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,634
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by sunfighter View Post
    I know a tag ending in /> will not cause your problems but how hard is it to do a replace /> with a >?
    /> is perfectly valid in XHTML5.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #7
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    alright guys thanks for the help but i figured it out!

    some of my margins had a "-" by it making it instead of 100px into -100px

    only affected safari and mobile phones. but works perfectly now. thanks again!

  • #8
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,105
    Thanks
    23
    Thanked 594 Times in 593 Posts
    felgall I spent this morning looking up and reading the "are closing tags legal in html5" articles on the web. My mind reals. I didn't come away with the "/> is perfectly valid in XHTML5. " as you did but with a "they're OK, will cause no harm" feeling. They do cause my editor to barf and are easy to remove as I stated so I do. Guess if other don't want to it's OK.

    But missing end tags will cause a problem and the last </div> on the page has no start tag. Even though I did say I wasn't gonna look at the code until it was cleaned up I did look at it and went ahead and did clean it back when this was first posted. Cleaning the code fixed the problems in all browsers except for OPERA and it's only problem that I saw was a larger than normal gap between the top and the middle section of the page.

  • #9
    Regular Coder Nerevarine's Avatar
    Join Date
    Jan 2013
    Location
    Phendrana Drifts, Tallon IV, W-Class
    Posts
    285
    Thanks
    0
    Thanked 17 Times in 17 Posts
    Blog Entries
    3
    I'm with sunfighter, you should clean up your code to both help and now and to prevent more issues in the future. Also, all browsers do different things (*cough* IE *cough*), so you should consider making separate bits of code for each browser. That would solve the problem of cross-browser compatibility. If this is too much of a time investment for you, just consider the fact that each browser (FF, IE, GC, O, etc.) has very specific different rules for how things are displayed. To prevent a multitude of errors, you should have everything validate and be cross-browser compatible.
    Hope this helps.

    PS. I would suggest separate code for mobile operating systems as well.
    Last edited by Nerevarine; 01-09-2013 at 03:33 PM. Reason: Added the PS

  • #10
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thank you sunfighter for taking the time to clean the code and see what it would look like. I will take out all the /> and replace with > in order to get errors down to as little as possible.

    for a validator i use http://validator.w3.org, in order to see my errors. Is this the best way to go about it or is there another way?

    In response to the cross browser capability, do any of you have any really good websites or tips to go about learning how to see what kind of browser (or mobile) it is and then call the appropriate script? I'm assuming its a simple script/line. But my assumptions were wrong previously so idk

  • #11
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,634
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by sunfighter View Post
    felgall I spent this morning looking up and reading the "are closing tags legal in html5" articles on the web.
    You misread what I wrote - I said that they are valid (in fact they are required) in XHTML5 - I agree that they are invalid in HTML 5 just as they are invalid in HTML4. A lot of people use them in HTML 4/5 because they intend to switch over to XHTML once everyone uses browsers that support it (just waiting for IE8 to die and then XHTML will be useable). The XHTML5 spec is being developed in parallel to HTML 5 so that they will be as close to the same as possible with the closing slashes being one of the few necessary differences.

    Both HTML 5 and XHTML 5 use the same doctype since the doctype has never told the browser whether the page is using HTML or XHTML separate ones are unnecessary - browsers have always used the MIME type to determine whether the page is HTML or XHTML.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #12
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    I wonder if maybe we're getting sidetracked on > or /> when the OP's real problem may be something he doesn't see is a problem.

    Quote Originally Posted by bagonize View Post
    The other errors on the validator don't seem to be anything that could possibly affect layout..
    I think there are plenty of errors that would cause problems in the layout.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #13
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,105
    Thanks
    23
    Thanked 594 Times in 593 Posts
    Thank you felgall. That makes sense. HTML 5 and XHTML 5 using the same doctype doesn't, but will have to live with it. I'll have to look up the difference between the two.


  •  

    Posting Permissions

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