...

View Full Version : float drop problem



joroco
10-11-2007, 11:47 PM
Hi,

I have a float drop problem with the code below. I haven't been able to figure out what to do with it, can anyone help?
My wrapper div won't center to the page either, it does in IE but not Firefox (so i know there must be something WRONG)

HTML


<div id="footer">
<div id="footerRight">

<div id="floatLeft">
<p><span class="big">Address:</span><br />
Fasanstigen 25<br />
123 32<br />
Bro<br />
Upplands Bro<br />
SWEDEN</p>
</div>

<div id="floatRight">
<p><span class="big">E-Mail:</span><br />
joroco@gmail.com</p>
<p><span class="big">Telephone:</span><br />
+(44) 7624 303819</p>
<p><span class="big">MSN:</span><br />
joroco.costello@hotmail.com</p>
</div>

</div>

</div>

CSS:


#footer {
width: 770px;
margin: 0;
padding: 0;
}

#footerRight {
width: 570px;
float: right;
background-color: #8B7E66;
margin: 0;
padding: 0;
}

#floatRight {
float: right;
margin: 15px;
text-align: right;
}

#floatLeft {
float: left;
margin: 15px;
text-align: left;
display: inline;
}

#footer p {
font-size: 0.8em;
font-family: Arial, "Trebuchet MS", Tahoma;
color: #CDC5BF;
margin: 0;
}

Heres some more code that might be useful, forgot to add it (reason for editing)


span.big {
font-size: 1em;
letter-spacing: 0.1em;
color: #FFA500;
font-weight: bold;
}

body {
margin: 0;
padding: 0;
text-align: center;
background-color: #8B8970;
}

#wrapper {
width: 770px;
margin: 0;
padding: 0;
}

Donkey
10-12-2007, 01:18 AM
Try


#wrapper {
width: 770px;
margin: 0 auto;
padding: 0;
}

joroco
10-12-2007, 10:03 AM
Thanks, that worked with the margin: auto;

daveyand
10-12-2007, 10:38 AM
Wicked i've had the same problem!! Thanks Donkey!

babeswar
01-15-2009, 08:09 PM
Hi, I have the same float-drop problem thats being talked here.The page on my right frame drops below the left tree frame when the browser(IE) window is minimized. Please look into my CSS and let me know what I can try, Thanks! in Advance
CSS:
body {font-family:Arial; padding:0px; margin:0px; background-color: #f2efeb; }
body.ie6 #content { height: 500px; }

p {font-family:Arial; color: #534741; margin: 0px;}

div {font-family:Arial; color: #534741; margin: 0px;}

span {font-family:Arial; color: #534741; margin: 0pt;}

h1 {text-align: center; font-family:Arial; font-weight: bold; font-size: 2em;}

h2 {text-align: left; font-family:Arial; font-weight: bold; font-size: 1.1em; color: #534741}

h3 {text-align: left; font-family:Arial; font-weight: bold; font-size:small; font-style: italic; color: #534741}

h4 {text-align: left; font-family:Arial; font-weight: bold; font-size:small; color: #534741}

h5 {text-align: left; font-family:Arial; font-style: italic; font-size:small; text-decoration: underline; color: #534741}

ul {margin-left:0; margin-top: 0; padding-left:1em; font-family:Arial; font-size:small; color: #534741}
ul ul {padding-left:1em; margin-top: 0; padding-top: 1px; font-family:Arial; font-size:small; color: #534741}

ol {margin-left:0; padding-left:2em; list-style-type: upper-roman; font-family:Arial; font-size:small; color: #534741}
ol ol {padding-left:0; list-style-type: upper-alpha; font-family:Arial; font-size:small; color: #534741}
ol ol ol {padding-left:0; list-style-type: decimal; font-family:Arial; font-size:small; color: #534741}
ol ol ol ol {padding-left:0; list-style-type: lower-alpha; font-family:Arial; font-size:small; color: #534741}
ol ol ol ol ol {padding-left:0; list-style-type: lower-roman; font-family:Arial; font-size:small; color: #534741}

/*
.topheader { font-family: Arial; font-size: xx-large; font-weight: bold; font-style: normal; color: #534741; background-color: #00FFFF; height: 100%; width: 100%; margin-bottom: 0px; margin: 0px 0px 0px 0px; }
.topheader1 { text-align: center; font-family: Arial; font-size:xx-large; color: #ffffff; margin: 0px 0px 0px 0px; }
*/

.topheader2 { text-align: left; font-family: Cambria; font-weight: bolder; font-size: larger; color: #ffffff; margin: 0px 0px 0px 0px; }

.horizontalrule {width: 100%; margin: 0px 0px 0px 0px; color: #534741}

#header {border:1px solid blue; background-color: #3388CC; float:right; width:100%; height:10%; margin: 0px 0px 0px 0px; font-family: Arial; font-size: xx-large; font-weight: bold; font-style: normal; color: #534741;}
/* Cambria Miriam #3388CC #3399CC #237bd2 - HMSA #d6cfc7 #d6cfc7 #cab9a4 #cab9a4 #f2efeb #f2efeb #736257 */
/*
#breadcrumb {background-color:white; float:right; width:80%; height:5%; margin: 0px 0px 0px 0px;}
*/

#container {background-color: #f2efeb; float:right; width:100%; min-height:500px; height:auto !important; height:500px; }

/* #left {background-color:#c5b098; float:left; width:15%; min-height:500px; height:auto !important; height:500px; margin: 0px 0px 0px 0px;} */
#left {background-color:#c5b098; float:left; font-family: Arial; font-size: medium; font-weight: normal; font-style: normal; color: #534741; width:15%; min-height:500px; height:auto !important; height:500px; margin: 0px 0px 0px 0px;}

#content {background-color: #f2efeb; border-style: none; display:block; float:right; width:84%; min-height:500px; height:auto !important; height:500px; margin: 0px 0px 0px 0px;}

#footer {background-color:#237bd2; float:right; width:100%; height:5%; margin: 0px 0px 0px 0px; }

.csfooter { text-align: center; font-family: Arial; font-weight: normal; font-size: x-small; color: #534741; margin: 0px;}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum