Mis-Aligned in IE., My site works fine in FF, but in IE the background is mis-aligned! |
Mis-Aligned in IE., My site works fine in FF, but in IE the background is mis-aligned! |
Jul 12 2008, 08:46 PM
Post
#1
|
|
![]() Newbie ![]() Group: Member Posts: 6 Joined: Jun 2007 Member No: 531,030 |
Okay, so I'm trying to re-do my site to celebrate Daniel Radcliffe's 19th birthday coming up.
When I preview the layout in Firefox, it looks perfectly fine: However, when I preview it in Internet Explorer, the background is mis-aligned: This is the code I'm using: CODE <style> body {background-color: a6a5ae; background-image:url("Future%20Lyts/danbg.png"); background-position: center; background-repeat: repeat-y; font-family: Trebuchet MS, Arial, sans-serif; font-size: 8pt; color: black;} a:link {font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color:fc066e; text-transform: none; text-decoration: none;} a:visited {font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color:fc066e; text-transform: none; text-decoration: none;} a:hover {font-family: Century Gothic, Arial, sans-serif; font-size: 8pt; color:black; text-transform: uppercase; text-decoration: none; } a.nav, a.nav:active, a.nav:link, a.nav:visited {font-family: Trebuchet MS, Helvetica, sans-serif; font-size: 9px; color: 7a06fc; text-transform: none; text-decoration: none; display: block !important; background-color:white; line-height: 12px; text-align: left; margin:0px; padding: 0px;} a.nav:hover {text-align: right !important; vertical-align: bottom; font-family: Arial, Helvitica, sans-serif; font-size:9px; background-color:8ef90f; color:fc066e; display: block; margin:0px; padding:0px; text-decoraton: none; text-transform:uppercase; line-height: 12px; font-weight: bold; border-left: 5px solid; border-color:06f3fc;} #rwr {position: relative; width:700px; top:0px; left: -350px; margin-left: 50%;} .tp {position:absolute; width:700px; left:0px; top:0px; height: 775px; background-color:transparent; background-image:url("Future%20Lyts/dan.png");} .cnt {position: absolute; padding: 0px; width: 450px; left: 245px; top: 500px; background-color: none; background-image:url("Future%20lyts/dancntbg.png");} .cnthdr {display: block; background-color:transparent; font-family: Trebuchet MS, Arial, Sans-serif; letter-spacing: -1pt; color: fc066e; line-height: 30px; text-align: left; font-size: 28pt; vertical-align: center; border-bottom: 2px solid; border-color: 7a06fc; text-transform: none;} .lnk {position: absolute; left: 9px; width: 200px; top: 500px; padding: 0px; background-color: none; background-image:url("future%20lyts/dancntbg.png");} .navhdr {display: block; background-color: transparent; font-family: Trebuchet MS,Arial, sans-serif; font-size: 12pt; color: 7a06fc; line-height: 15px; text-align: right; vertical-align: center; text-transform: lowercase; background-image:url("images/rblnkhdr.png"); background-position: top right; background-repeat; no-repeat; border-bottom: 2px solid; border-color: 8ef90f;} textarea {width: 150px; height: 15px; font-family: Small Fonts; font-size: 6pt; background-color:white; color:7a06fc; border: 1px solid fc066e;} .aut {display: block; font-family: Arial, Helvetica, sans-serif; font-size: 8pt; color:fc066e; text-transform: none; text-decoration: none; background-color: white; border-bottom: 2px dashed; border-color: 06f3fc; text-align: right;} .cmnt {float: right; font-family: Arial, sans-serif; font-color:fc066e; font-size: 8pt;} .copy {position: absolute; left: 2px; width: 700px; height: 50px; background-image:url("future%20lyts/dancpyright.png");} </style>[/code] I had the same problem with a previous layout, only this time it's the image that was mis-aligned in IE. Firefox: ![]() Internet Explorer: ![]() And this was the code I used: [code]<style> body {background-color: black; background-image:url("images/sitejonasbg.png"); background-position: center; background-repeat: repeat-y; font-family: Trebuchet Ms, sans-serif; font-size: 10pt; letter-spacing: -.5pt; color: white;} a:link {font-family: Trebuchet MS, Helvetica, sans-serif; font-size: 9pt; color:cc00ff; text-transform: none; text-decoration: none;} a:visited {font-family: Trebuchet MS, Helvetica, sans-serif; font-size: 9pt; color:cc00ff; text-transform: none; text-decoration: none;} a:hover {font-family: Times New Roman, Georgia, serif; font-size: 9pt; color:0deeff; text-transform: uppercase; text-decoration: none; } a.nav, a.nav:active, a.nav:link, a.nav:visited {font-family: Trebuchet MS, Helvetica, sans-serif; font-size: 9px; color: 0deeff; text-transform: none; text-decoration: none; display: block !important; background-color:333333; line-height: 12px; text-align: left; margin:0px; padding: 0px;} a.nav:hover {text-align: right !important; vertical-align: bottom; font-family: Times New Roman, Georgia, serif; font-size:9px; background-color:333333; color:cc00ff; display: block; margin:0px; padding:0px; text-decoraton: none; text-transform:uppercase; line-height: 12px; font-weight: bold;} #bdy {position: relative; margin: auto; width: 750px;} .tp {position: absolute; width:750px; left:2px; margin-top: -7; height:500px; background-color: transparent; background-image:url("images/sitejonasheader copy.png");} .cnt {position: absolute; padding: 0px; width: 546px; left: 4px; top: 400px; background-color: none; background-image:url("images/cntbg.png");} .cnthdr {display: block; background-color:363636; font-family: times new roman; letter-spacing: -1pt; color: black; line-height: 35px; text-align: right; font-size: 32pt; vertical-align: bottom; background-image:url("images/contentheader.png"); background-position: top-right; background-repeat: no-repeat;} .lnk {position: absolute; left: 560px; width: 188px; top: 400px; height: 100%; padding: 0px; background-color: none; background-image:url("images/cntbg.png");} .navhdr {display: block; background-color: white; font-family: Trebuchet Ms, sans-serif; font-size: 18pt; color: black; line-height: 20px; vertical-align: center; background-image:url("images/navhdr.png"); background-position: top right; background-repeat; no-repeat;} textarea {width: 150px; height: 70px; font-family: courier; font-size: 8pt; background-color:black; color:cc00ff; border: 1px solid 0deeff;}</style> This is INCREDIBLY FRUSTRATING! I would love some help!
Reason for edit: Thumbed; codebox tags edited. - Cristy
|
|
|
|
![]() |
Jul 12 2008, 08:49 PM
Post
#2
|
|
![]() /人◕‿‿◕人\ ![]() ![]() ![]() ![]() ![]() ![]() ![]() Group: Official Member Posts: 8,283 Joined: Dec 2007 Member No: 602,927 |
Copy/paste the position attributes, and add an underscore before them. Adjust those to your liking.
|
|
|
|
randomchicka1994 Mis-Aligned in IE. Jul 12 2008, 08:46 PM
randomchicka1994 Ohmygoodness... That is so simple but it WORKED... Jul 12 2008, 08:53 PM
jaeminnie Closed and moved to MySpace Resolved Topics. Jul 13 2008, 11:20 AM![]() ![]() |