- This topic is empty.
-
AuthorPosts
-
March 18, 2009 at 8:49 am #24371dmbutlerMember
Hello All,
Just wondering if I could call upon your assistance again? I have a right floated div that drops to the bottom when viewed in IE. Would somebody know why this is happening? Could it be the IE Box viewing bug I’ve read about? Any help would be gratefully received.
Thank you, D. :)
http://www.kscope.co.uk/upload/files/contact.html
And here’s some of the potentially relevant CSS
Code:@charset “UTF-8″;
* {
margin: 0;
padding: 0;
}
img, header, div { behavior: url(iepngfix.htc)
}
body {
font-family: Arial, Helvetica, sans-serif;
background: #99CCCC url(../pictures/gradient.jpg) no-repeat;
}
h1, h2, h3, p {
font-family: Arial, Helvetica, sans-serif;
}
h1 {
font-size: 25px;
padding: 5px 5px 5px 0px;
}
h2 {
font-size: 12px;
text-transform: uppercase;
margin-top: 10px;}
h2 a {
color: #FFFFFF;
text-decoration: none;
background: #003333;
padding: 8px 40px;
border: 1px solid #FFCC00;
}
h2 a:hover {
color: #003333;
background: #FFCC00;
border: 1px solid #003333;
}
p {
font-size: 12px;
line-height: 18px;
}
p a {
color: #000000;
text-decoration: underline;
}
p a:hover {
color: #FFCC00;
}
p a:visited {
color: #666666;
}
.title {
float: right;
width: 524px;
margin-bottom: 8px;
border-bottom: 1px solid #333333;
margin-right: 8px;
height: 40px;
}
.active {
}
#wrapper {
width: 940px;
margin: auto;
background: url(../pictures/shadow.png) repeat-y;
}
#wrapperContent {
width: 900px;
margin-right: auto;
margin-left: auto;
background: #FFFFFF;
height: 100%;
}
#header {
background: url(../pictures/header.jpg);
height: 24px;
width: 900px;
margin-right: auto;
margin-left: auto;
border-bottom: 4px solid #FFCC00;
padding-top: 123px;
}
#header ul {
list-style: none;}
#header li {
display: inline;}
#header li a {
display: block;
padding: 5px 15px;
float: right;
color: #FFFFFF;
font: 12px Arial, Helvetica, sans-serif;
text-transform: uppercase;
text-decoration: none;}
#header li .active {
color: #000000;
background: #FFCC00;
}
#header a:hover {
color: #000000;
background: #FFCC00;}
#content {
width: 884px;
padding-top: 8px;
border-top: 1px solid #333;
margin-right: 8px;
margin-left: 8px;
}
#slider {
width: 880px;
height: 276px;
border: 2px solid #CCCCCC;
margin: 8px auto;
}#sidebarLeft {
float: left;
width: 315px;
background: #FFFFCC url(../pictures/quote.jpg);
height: 273px;
border: 1px solid #FFCC00;
margin-bottom: 8px;
padding-top: 55px;
padding-left: 15px;
padding-right: 8px;
}
#sidebarLeft p {
}
#sidebarRight {
float: right;
width: 524px;
margin-bottom: 16px;
margin-right: 8px;
}
#sidebarRight ul {
list-style: url(../pictures/pointer.jpg) none inside;
font-size: 12px;
line-height: 20px;
padding-top: 5px;
}
#sidebarRight li {
background: center;
}
#sidebarRight a {
color: #000000;
}
#sidebarRight a:hover {
color: #FFCC00;
}
#footer {
height: 25px;
width: 890px;
clear: both;
border-top: 2px solid #FFCC00;
padding-top: 8px;
background: url(../pictures/footer.jpg);
color: #F0F0F0;
padding-left: 10px;
margin-right: auto;
margin-left: auto;
}
#footer a {
font-size: 11px;
color: #CCCCCC;
}
#footer a:hover {
color: #FFCC00;
}
#end {
height: 35px;
width: 940px;
background: url(../pictures/end.png) no-repeat 0px -10px;
margin-right: auto;
margin-left: auto;
}
#contact {
background: url(../pictures/contact.jpg) no-repeat;
}
#form {
float: left;
width: 315px;
background: url(../pictures/quickQuote.jpg) no-repeat;
height: 100%;
border: 1px solid #FFCC00;
margin-bottom: 8px;
padding-top: 55px;
padding-left: 15px;
padding-right: 8px;
}
.fieldset {
border-style: none;
width: 315px;
float: left;
}
.submit {
background-color:#003333;
color:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
margin-bottom:8px;
padding:2px;
margin-top: 0px;
}
.textfield {
background-color:#FFFF99;
border:1px solid #FFCC00;
color:#000000;
font-family:Georgia,”Times New Roman”,Times,serif;
font-size:10px;
overflow:auto;
padding:5px;
width:300px;
margin-bottom: 5px;
}
.label {
font: 11px/20px Arial, Helvetica, sans-serif;
text-transform: uppercase;
width: 300px;
}
.formfield {
background-color:#FFFF99;
border:1px solid #FFCC00;
color:#000000;
display:block;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
padding:5px;
width:300px;
}March 18, 2009 at 9:25 am #55111Rob MacKayParticipantyou have your #contact and #sidebarRight outside of your content div. That div is set for the full width of the area, so its rendering it outside that div, which is underneath.
Try moving your #contact and #sidebarRight into the #content div
March 19, 2009 at 6:27 am #55143dmbutlerMemberThank you, Robski! That worked perfectly – I didn’t even notice! :D
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.