Design perfect in FF, wrong in IE |
![]() ![]() |
Design perfect in FF, wrong in IE |
Aug 22 2006, 08:48 PM
Post
#1
|
|
|
Member ![]() ![]() Group: Member Posts: 13 Joined: Aug 2006 Member No: 456,475 |
I have created a myspace page that works perfectly in Firefox, however in IE it is off center and adds extra length to the page.
If anyone could tell me where it is I'm going wrong that'd be great! www.myspace.com/whowhatwherewhenwhy Thanks, adam (sorry for the post in an existing topic!) |
|
|
|
| *This Confession* |
Aug 22 2006, 09:00 PM
Post
#2
|
|
Guest |
use this for it to look better in IE
About me: CODE <style type="text/css">.comments {visibility:hidden;display:none;}</style> Who id like to meet: CODE <div class="comments"><table><tr><td><table><tr><td>
|
|
|
|
Aug 23 2006, 08:05 AM
Post
#3
|
|
|
Member ![]() ![]() Group: Member Posts: 13 Joined: Aug 2006 Member No: 456,475 |
Thanks for the help, but I already had the .comments part in there as well as the code for who I'd like to meet, and the page still plays up in IE.
I've validated it at W3C and tried removing anything I thought would be the problem but to no effect! Any other ideas? |
|
|
|
Aug 23 2006, 01:08 PM
Post
#4
|
|
|
t-t-t-toyaaa ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Group: Official Member Posts: 19,821 Joined: Apr 2004 Member No: 11,270 |
Don't validate your myspace. Its myspace.. You can't even do alot of html stuff on there. Its like a waste of your time to me. Its good to have great coding, but its myspace.
Go through your code and make sure you don't have any heights set to 900px or higher Secondly, go through your code and figure out which code you used to hide your profile. I suggest this one because it hides your comments with it. If you use that , take out the code to hide your comments. Thirdly-ish, make sure your bottom links are hidden . I can only give suggestions since I don't have IE. |
|
|
|
Aug 23 2006, 01:16 PM
Post
#5
|
|
|
Member ![]() ![]() Group: Member Posts: 13 Joined: Aug 2006 Member No: 456,475 |
Thanks for the help, I'll give all that a go.
When I validated it, I simply validated the css I'd written to check if there were any major mistakes! |
|
|
|
Aug 23 2006, 01:29 PM
Post
#6
|
|
|
t-t-t-toyaaa ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Group: Official Member Posts: 19,821 Joined: Apr 2004 Member No: 11,270 |
Ah I see. I thought you validated the html. Which would be kind of pointless. If even possible.
|
|
|
|
Aug 23 2006, 01:30 PM
Post
#7
|
|
|
Member ![]() ![]() Group: Member Posts: 13 Joined: Aug 2006 Member No: 456,475 |
I tried that hide all code instead of the version I was already using and it made it even worse in IE!
Also, there are no heights above 900px and the bottom links are hidden.... The investigation continues! |
|
|
|
Aug 23 2006, 01:31 PM
Post
#8
|
|
|
t-t-t-toyaaa ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Group: Official Member Posts: 19,821 Joined: Apr 2004 Member No: 11,270 |
How does it look in ie with the code? You would have too kind of redo the layout with it. Basically . But the point is is the space gone with the code? If it is you should just redo your layout using that code to hide it.
|
|
|
|
Aug 23 2006, 04:08 PM
Post
#9
|
|
|
Member ![]() ![]() Group: Member Posts: 13 Joined: Aug 2006 Member No: 456,475 |
I've attached a screenshot of the page in IE, to give an idea of what the problem is.
Also the code is below, do you notice anything that could be causing this? About me: <style type="text/css"> div, table, tr, td, th { background-color : transparent; text-align : left; border : 0; } a.navbar, font, .whitetext12, .btext, .orangetext15, .redbtext, .redtext, .blacktext12, .lightbluetext8, strong, .nametext, div b font font, div font font u, table table table table, table.contacttable { display : none; } td.text table table { display : inline; visibility : visible; } .comments { visibility:hidden; position:absolute; overflow:hidden; background-color:transparent; border:0px solid; width:0px; height: 0px; top: 0px; z-index:4; } body { background-image : url('http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/carpet.jpg'); background-attachment : scroll; margin : 0; padding : 0; } a, a:link, a:active, a:visited { color : red; font : italic 12pt Georgia; text-decoration : none; } a:hover { text-decoration : none; } img { border : none; } table tr td { background-color : transparent; } .profile { position : absolute !important; left : 55px !important; top : 150px !important; z-index : 1; margin : 0 auto !important; } .tabletop { margin : 0 auto !important; position : absolute; left : 0; top : 0; background-image : url('http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/tablebackgroundlg.jpg'); border : 0; padding : 0; height : 773px; width : 1004px; z-index : 2; } .bufferbottom { position : absolute; left : 50%; top : 900px; z-index : 2; height : 110px; } .photo1 { position : absolute; left : 100px; top : 45px; z-index : 4; } .messageme { position : absolute; left : 430px; top : 695px; z-index : 4; } .addme { position : absolute; left : 285px; top : 685px; z-index : 4; } .blockme { position : absolute; left : 655px; top : 710px; z-index : 4; } .scrappaper { position : absolute; left : 350px; top : 105px; z-index : 3; } .scrappapertext { position : absolute; left : 410px; top : 165px; background : transparent; font-size : 11pt; font-family : georgia; letter-spacing : 1px; line-height : 197%; color : black; text-align : left; padding : 20px; height : 270px; width : 348px; z-index : 3; } .pencil { position : absolute; left : 597px; top : 98px; border : 0; padding : 0; z-index : 4; } .postit { border : 0; padding : 0; position : absolute; left : 745px; top : 365px; z-index : 3; } .ipod { position : absolute; left : -34px; top : 430px; border : 0; padding : 0; z-index : 3; } .homelink { position : absolute; left : 12px; top : 5px; border : 0; padding : 0; z-index : 2; } .addcomment { position : absolute; left : 845px; top : 195px; border : 0; padding : 0; z-index : 4; } .viewcomments { position : absolute; left : 845px; top : 260px; border : 0; padding : 0; z-index : 4; } .mobilephone { border : 0; padding : 0; position : absolute; left : 700px; top : 15px; z-index : 4; } .mobilephonevideo { position : absolute; left : 735px; top : 45px; border : 0; padding : 0; z-index : 5; } .myfriends { position : absolute; left : 200px; top : 460px; z-index : 2; } .paul { position : absolute; left : 245px; top : 515px; z-index : 2; } .sam { position : absolute; left : 330px; top : 530px; z-index : 2; } .joe { position : absolute; left : 415px; top : 495px; z-index : 2; } .minna { position : absolute; left : 490px; top : 520px; z-index : 2; } .viewallfriends { position : absolute; left : 580px; top : 510px; z-index : 2; } div td font { visibility : hidden; } .navbar { visibility : hidden; } </style> <div align="center" class="profile"> <div class="tabletop"> <div class="photo1"><a href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewPicture&friendID=72674862"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/profilephoto.png"></a></div> <div class="messageme"><a href="http://mail.myspace.com/index.cfm?fuseaction=mail.message&friendID=72674862"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/messageme.png"></a></div> <div class="addme"><a href="http://collect.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=72674862"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/addme.png"></a></div> <div class="blockme"><a href="http://collect.myspace.com/index.cfm?fuseaction=block.blockUser&userID=72674862"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/blockme.png"></a></div> <div class="scrappaper"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/scrappaper.png"></div> <div class="scrappapertext"> <b>Hello!</b> I'm busy enjoying my final<br>summer before graduating whilst<br>also trying to get on with designing<br>my portfolio. However, I've instead been designing this to replace the normal, awful, myspace design. <BR><BR> <i>[If you made the wrong choice and use<br>Internet Explorer this page will be messed up... <b><a href="http://www.firefox.com" target="_new">use Firefox</a></b>]</i></div> <div class="pencil"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/pencil.png"></div> <div class="postit"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/postit.png"></div> <div class="ipod"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/ipod.png"></div> <div class="homelink"><a href="http://home13.myspace.com/index.cfm?fuseaction=user"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/home.png"></a></div> <div class="addcomment"><a href="http://comments.myspace.com/index.cfm?fuseaction=user&circuitaction=viewProfile_commentForm&friendID=72674862&name=adam&MyToken=f096ab4f-0a44-4ada-a9cc-2b8b9cf15c16"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/addcomment.png"></a></div> <div class="viewcomments"><a href="http://comments.myspace.com/index.cfm?fuseaction=user.viewComments&friendID=72674862"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/viewcomments.png"></a></div> <div class="mobilephone"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/mobile.png"></div> <div class="mobilephonevideo"><embed allowScriptAccess="never" allowNetworking="internal" src="http://www.meme-london.co.uk/portfolio/118118/choir.mov" width="128" height="104" scale="0.58"></div></style> <div class="paul"><a href="http://www.myspace.com/suverner"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/paul.png"></a></div> <div class="sam"><a href="http://www.myspace.com/axtell_foley"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/sam.png"></a></div> <div class="joe"><a href="http://profile.myspace.com/index.cfm?fuseaction=user.viewprofile&friendid=68254343"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/joe.png"></a></div> <div class="minna"><a href="http://www.myspace.com/minnar"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/minna.png"></a></div> <div class="myfriends"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/myfriends.png"></div> <div class="viewallfriends"><a href="http://home.myspace.com/index.cfm?fuseaction=user.viewfriends&friendID=72674862"><img src="http://i104.photobucket.com/albums/m195/whowhatwherewhenwhy/viewallfriends.png"></a></div> </div> </div> I'd like to meet: <div class="comments"><table><tr><td><table><tr><td>
Attached File(s)
|
|
|
|
Aug 23 2006, 04:25 PM
Post
#10
|
|
![]() Quiet, Doggie! ![]() ![]() ![]() ![]() ![]() Group: Member Posts: 394 Joined: Aug 2006 Member No: 452,267 |
hmm im using IE with a resolution of 1024x768 and your layout looks fine to me.
|
|
|
|
Aug 23 2006, 04:39 PM
Post
#11
|
|
|
Member ![]() ![]() Group: Member Posts: 13 Joined: Aug 2006 Member No: 456,475 |
Rose-A-Lee, any chance of a quick screenshot? Is it central and covering the standard myspace links?
This is bizarre! |
|
|
|
Aug 23 2006, 04:48 PM
Post
#12
|
|
![]() Quiet, Doggie! ![]() ![]() ![]() ![]() ![]() Group: Member Posts: 394 Joined: Aug 2006 Member No: 452,267 |
well okay, when i said "fine" i was talking about the alignment. but you're layout itself looks funky in my browser. but that's because my browser disagrees with pngs and it has nothing to do with your code.
[attachment=14080:attachment] |
|
|
|
Aug 23 2006, 04:58 PM
Post
#13
|
|
|
Member ![]() ![]() Group: Member Posts: 13 Joined: Aug 2006 Member No: 456,475 |
You should upgrade!
Erm, okay thats good I guess maybe its just the useless old IE for mac thats cocking things up! I should switch my pngs for gifs really shouldn't I! |
|
|
|
Aug 23 2006, 04:59 PM
Post
#14
|
|
![]() Quiet, Doggie! ![]() ![]() ![]() ![]() ![]() Group: Member Posts: 394 Joined: Aug 2006 Member No: 452,267 |
it would probably take less time to load and agree with my browser.
double whammy |
|
|
|
Aug 23 2006, 05:26 PM
Post
#15
|
|
|
Member ![]() ![]() Group: Member Posts: 13 Joined: Aug 2006 Member No: 456,475 |
I'm going through replacing them now, however I chose png to start with because it is much better for transparent backgrounds, with gifs - as you can see on my page now - the edges have a whiteness to them!
|
|
|
|
Aug 23 2006, 10:03 PM
Post
#16
|
|
![]() Quiet, Doggie! ![]() ![]() ![]() ![]() ![]() Group: Member Posts: 394 Joined: Aug 2006 Member No: 452,267 |
simply a price to pay for browser compatibility. we all have to make compromises.
|
|
|
|
![]() ![]() |