Webmaster Forum

Go Back   Webmaster Forum > Web Development > Coding Forum

Coding Forum Problems with your code? Discuss coding issues, including JavaScript, PHP & MySQL, HTML & CSS, Flash & ActionScript, and more.


Reply
 
Thread Tools Display Modes
Share |
  #1  
Old 11-26-2009, 08:07 PM
SimonG SimonG is offline
Junior Member
 
Join Date: 11-26-09
Posts: 3
iTrader: 0 / 0%
Background images in IE

I'm trying to put together a basic personal homepage using a number of background images, specified in the CSS file. The page works find in both Firefox and Chrome, but none of the images appear in IE7 or IE8.

The temp page can be found at: http://raduza.com/testpage

While this may not be the tidiest way to create this kind of page, the background image problem has me stumped, so this is quickly turning into a learning experience. Any advice would be appreciated!
 
Reply With Quote

Advertisement

Advertisement

  #2  
Old 11-26-2009, 08:53 PM
HTMLBasicTutor's Avatar
HTMLBasicTutor HTMLBasicTutor is offline
Administrator
 
Join Date: 10-29-07
Location: Canada
Posts: 26,710
iTrader: 5 / 100%
Probably because you have confused the heck out of IE with this:
Code:
<div id="header"> <top><a href="#">Top</a></top> <left1><a href="#">Left1</a></left1> <logo><a href="http://simongoudie.com">Logo</a></logo> <right1><a href="#">Right1</a></right1> <left2><a href="#">Left2</a></left2> <name><a href="http://simongoudie.com">Name</a></name> <right2><a href="#">Right2</a></right2> <left3><a href="#">Left3</a></left3> <phone><a href="#">Phone</a></phone> <right3><a href="#">Right3</a></right3> <left4><a href="#">Left4</a></left4> <email><a href="mailto:simon@simongoudie.com">email</a></email> <web><a href="http://simongoudie.com">web</a></web> <right4><a href="#">Rigth4</a></right4> <bottom><a href="#">Bottom</a></bottom> </div>
What were you trying to do with this coding?
 
Reply With Quote
  #3  
Old 11-26-2009, 08:59 PM
HTMLBasicTutor's Avatar
HTMLBasicTutor HTMLBasicTutor is offline
Administrator
 
Join Date: 10-29-07
Location: Canada
Posts: 26,710
iTrader: 5 / 100%
BTW, if you used the Web Dev toolbar in FF to check your coding on this page, it's wrong. There are 26 errors on this page per the W3C HTML validator (the people who write the specs).
 
Reply With Quote
  #4  
Old 11-26-2009, 09:14 PM
SimonG SimonG is offline
Junior Member
 
Join Date: 11-26-09
Posts: 3
iTrader: 0 / 0%
I sliced the image into pieces, then for each piece (ie 'top') set a tag then styled it in the CSS as a background image, all within a centered div. Some of these will have links, and I will clear out the <a href>'s for the ones that don't.

Firefox seems to cope fine with this, IE on the other hand has no idea what I'm trying to do (which could be understandable...). I validated it and received those errors, but they refer to the non-standard tags which I would have thought would be ok, as they are only there to receive styling from the CSS.
 
Reply With Quote
  #5  
Old 11-26-2009, 09:23 PM
megamoose's Avatar
megamoose megamoose is offline
v7n Mentor
 
Join Date: 06-04-06
Location: Guildford
Posts: 557
iTrader: 2 / 100%
You can't just make up your own tags! Read-read what htmlbasictutor has told you. Go through the W3 markup validation service and fix those errors:
Get Full Results
Code:
Line 23, column 7: element "top" undefined. Did you mean "input" or "applet"? <top><a href="#">Top</a></top> Line 24, column 9: element "left1" undefined. Did you mean "applet" or "select"? <left1><a href="#">Left1</a></left1> Line 25, column 8: element "logo" undefined. Did you mean "tfoot" or "blockquote"? <logo><a href="http://simongoudie.com">Logo</a></logo> Line 26, column 10: element "right1" undefined. Did you mean "script" or "noscript"? <right1><a href="#">Right1</a></right1>
Instead of those invalid tags consider using:
Code:
<div id="top">
or
Code:
<span id="top">
 
Reply With Quote
  #6  
Old 11-26-2009, 09:31 PM
SimonG SimonG is offline
Junior Member
 
Join Date: 11-26-09
Posts: 3
iTrader: 0 / 0%
Aha, so tags I can't make up, but spans and divs (and lists) I can. That should be it then, I'll try rewriting it that way. Thanks for clarifying so quickly.

Just beside the point - given that it displays my, ah, 'custom' tags in Firefox/Chrome, are those browsers doing something extra that isn't technically correct, or is IE not doing something that is correct?
 
Reply With Quote
  #7  
Old 11-26-2009, 11:37 PM
HTMLBasicTutor's Avatar
HTMLBasicTutor HTMLBasicTutor is offline
Administrator
 
Join Date: 10-29-07
Location: Canada
Posts: 26,710
iTrader: 5 / 100%
Have no idea why FF is rendering this. This is once instance where IE is correct and FF is wrong.

It should have flopped in FF too. You spec'd XHTML 1.0 Transitional in DOCTYPE declaration so it should have been broken.
 
Reply With Quote
Go Back   Webmaster Forum > Web Development > Coding Forum

Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

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

Similar Threads
Thread Thread Starter Forum Replies Last Post
Background Images Please Help dean19693 Web Design Lobby 4 10-18-2009 11:18 PM
Background Removal For Images Alex Ross Graphic Design Forum 11 11-22-2008 07:55 AM
Rotating background images using CSS and PHP Powerlines2000 Coding Forum 1 04-26-2008 01:44 PM
Alt Tag and Background Images Estreetloans SEO Forum 23 06-13-2007 11:57 AM


V7N Network
Get exposure! V7N I Love Photography V7N SEO Blog V7N Directory


All times are GMT -7. The time now is 10:03 AM.
Powered by vBulletin
Copyright 2000-2014 Jelsoft Enterprises Limited.
Copyright © 2003 - 2018 VIX-WomensForum LLC