Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 12-26-2012, 04:50 AM   PM User | #1
bagonize
New to the CF scene

 
Join Date: Dec 2012
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
bagonize is an unknown quantity at this point
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!
bagonize is offline   Reply With Quote
Old 12-26-2012, 12:39 PM   PM User | #2
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,498
Thanks: 18
Thanked 362 Times in 361 Posts
sunfighter is on a distinguished road
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.
sunfighter is offline   Reply With Quote
Old 12-29-2012, 05:40 AM   PM User | #3
bagonize
New to the CF scene

 
Join Date: Dec 2012
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
bagonize is an unknown quantity at this point
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.
bagonize is offline   Reply With Quote
Old 01-08-2013, 11:54 PM   PM User | #4
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,498
Thanks: 18
Thanked 362 Times in 361 Posts
sunfighter is on a distinguished road
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?
sunfighter is offline   Reply With Quote
Old 01-09-2013, 12:45 AM   PM User | #5
Excavator
Master Coder


 
Excavator's Avatar
 
Join Date: Dec 2006
Location: Alaska
Posts: 9,410
Thanks: 22
Thanked 1,765 Times in 1,749 Posts
Excavator has a spectacular aura aboutExcavator has a spectacular aura aboutExcavator has a spectacular aura about
Hello bagonize,
Quote:
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
Excavator is offline   Reply With Quote
Old 01-09-2013, 05:06 AM   PM User | #6
felgall
Master Coder

 
felgall's Avatar
 
Join Date: Sep 2005
Location: Sydney, Australia
Posts: 5,532
Thanks: 0
Thanked 503 Times in 494 Posts
felgall is a jewel in the roughfelgall is a jewel in the roughfelgall is a jewel in the rough
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/
felgall is offline   Reply With Quote
Old 01-09-2013, 05:46 AM   PM User | #7
bagonize
New to the CF scene

 
Join Date: Dec 2012
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
bagonize is an unknown quantity at this point
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!
bagonize is offline   Reply With Quote
Old 01-09-2013, 02:56 PM   PM User | #8
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,498
Thanks: 18
Thanked 362 Times in 361 Posts
sunfighter is on a distinguished road
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.
sunfighter is offline   Reply With Quote
Old 01-09-2013, 03:31 PM   PM User | #9
L0adOpt1c
New Coder

 
L0adOpt1c's Avatar
 
Join Date: Jan 2013
Location: <bed />
Posts: 95
Thanks: 0
Thanked 7 Times in 7 Posts
L0adOpt1c is an unknown quantity at this point
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 L0adOpt1c; 01-09-2013 at 03:33 PM.. Reason: Added the PS
L0adOpt1c is offline   Reply With Quote
Old 01-09-2013, 08:41 PM   PM User | #10
bagonize
New to the CF scene

 
Join Date: Dec 2012
Posts: 4
Thanks: 0
Thanked 0 Times in 0 Posts
bagonize is an unknown quantity at this point
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
bagonize is offline   Reply With Quote
Old 01-09-2013, 08:47 PM   PM User | #11
felgall
Master Coder

 
felgall's Avatar
 
Join Date: Sep 2005
Location: Sydney, Australia
Posts: 5,532
Thanks: 0
Thanked 503 Times in 494 Posts
felgall is a jewel in the roughfelgall is a jewel in the roughfelgall is a jewel in the rough
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/
felgall is offline   Reply With Quote
Old 01-09-2013, 09:17 PM   PM User | #12
Excavator
Master Coder


 
Excavator's Avatar
 
Join Date: Dec 2006
Location: Alaska
Posts: 9,410
Thanks: 22
Thanked 1,765 Times in 1,749 Posts
Excavator has a spectacular aura aboutExcavator has a spectacular aura aboutExcavator has a spectacular aura about
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
Excavator is offline   Reply With Quote
Old 01-10-2013, 03:32 PM   PM User | #13
sunfighter
Senior Coder

 
Join Date: Jan 2011
Location: Missouri
Posts: 2,498
Thanks: 18
Thanked 362 Times in 361 Posts
sunfighter is on a distinguished road
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.
sunfighter is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 04:33 AM.


Advertisement
Log in to turn off these ads.