PDA

View Full Version : 3 columns not floating


dloj333
09-11-2011, 11:00 PM
Hi everybody, I am new to Dreamweaver and I am building this site to have three columns. Looks great in Dreamweaver but will not float in a browser either IE 8 or Firefox 6.0.2.
Here is where you can see the site:
http://socalda.org/New_Folder/index.html
Can anyone please help. Pulling my hair at this point.

edbr
09-12-2011, 12:45 AM
are you usinhg position: relative: ?

domedia
09-12-2011, 01:43 AM
There is no styles to any of the columns.

dloj333
09-12-2011, 04:26 AM
Thanks for the input. I guess I am confused as to why they look fine in Dreamweaver and not in a browser. I would think the float should be fine for position and I have the width in my style sheet:

#left_column, #center_column, #right_column
{
width: 30%;

float: left;
}
#center_column, #right_column {
margin-left: 5%;
}

So I am still confused as to why Dreamweaver sees them fine but my browsers not.

edbr
09-12-2011, 05:36 AM
its not in your styles. add it and it will work

edbr
09-12-2011, 05:37 AM
why have you got doctype fieldsets and login in a . css stylesheet? hold tight its showing a 404 but the styles are there

edbr
09-12-2011, 05:41 AM
try this

@charset "utf-8";
/* CSS Document */

body{margin:0;font-size:.7em;font-family:Verdana,Arial,Helvetica,sans-serif;background:#CBE1EF;}
code{margin:0;color:#006600;font-size:1.1em;font-weight:bold;}
.config_source code{font-size:.8em;color:#000000;}
pre{margin:0;font-size:1.4em;word-wrap:break-word;}
ul,ol{margin:10px 0 10px 40px;}
ul.first,ol.first{margin-top:5px;}
fieldset{padding:0 15px 10px 15px;}
.summary-container fieldset{padding-bottom:5px;margin-top:4px;}
legend.no-expand-all{padding:2px 15px 4px 10px;margin:0 0 0 -12px;}
legend{color:#333333;padding:4px 15px 4px 10px;margin:4px 0 8px -12px;_margin-top:0px;
border-top:1px solid #EDEDED;border-left:1px solid #EDEDED;border-right:1px solid #969696;
border-bottom:1px solid #969696;background:#E7ECF0;font-weight:bold;font-size:1em;}
a:link,a:visited{color:#007EFF;font-weight:bold;}
a:hover{text-decoration:none;}
h1{font-size:2.4em;margin:0;color:#FFF;}
h2{font-size:1.7em;margin:0;color:#CC0000;}
h3{font-size:1.4em;margin:10px 0 0 0;color:#CC0000;}
h4{font-size:1.2em;margin:10px 0 5px 0;
}#header{width:96%;margin:0 0 0 0;padding:6px 2% 6px 2%;font-family:"trebuchet MS",Verdana,sans-serif;
color:#FFF;background-color:#5C87B2;
}#content{margin:0 0 0 2%;position:relative;}
.summary-container,.content-container{background:#FFF;width:96%;margin-top:8px;padding:10px;position:relative;}
.config_source{background:#fff5c4;}
.content-container p{margin:0 0 10px 0;
}#details-left{width:35%;float:left;margin-right:2%;
}#details-right{width:63%;float:left;overflow:hidden;
}#server_version{width:96%;_height:1px;min-height:1px;margin:0 0 5px 0;padding:11px 2% 8px 2%;color:#FFFFFF;
background-color:#5A7FA5;border-bottom:1px solid #C1CFDD;border-top:1px solid #4A6C8E;font-weight:normal;
font-size:1em;color:#FFF;text-align:right;
}#server_version p{margin:5px 0;}
table{margin:4px 0 4px 0;width:100%;border:none;}
td,th{vertical-align:top;padding:3px 0;text-align:left;font-weight:bold;border:none;}
th{width:30%;text-align:right;padding-right:2%;font-weight:normal;}
thead th{background-color:#ebebeb;width:25%;
}#details-right th{width:20%;}
table tr.alt td,table tr.alt th{background-color:#ebebeb;}
.highlight-code{color:#CC0000;font-weight:bold;font-style:italic;}
.clear{clear:both;}
.preferred{padding:0 5px 2px 5px;font-weight:normal;background:#006633;color:#FFF;font-size:.8em;}

#left_column, #center_column, #right_column
{
width: 30%;

float: left;
}
#center_column, #right_column {
margin-left: 5%;
}

dloj333
09-12-2011, 02:49 PM
Thanks for your input. So would formatting my columns other than what I have make them not be floating correctly in a browser but fine in Dreamweaver. On the practice project I was using in Dreamweaver it showed fine in both Dreamweaver and browser. I am using the basic same format the practice project used.
I added your suggestion EDBR and it did nothing.
As far as:"its not in your styles. add it and it will work "
add what in my styles?
If I am missing something huge can you point me to a good tutorial?

gentleone
09-12-2011, 03:03 PM
I sill see all that HTML stuff in your stylesheet. Just copy the code edbr posted, select everything in your stylesheet and replace it with edbr's code.

domedia
09-12-2011, 03:53 PM
Thanks for your input. So would formatting my columns other than what I have make them not be floating correctly in a browser but fine in Dreamweaver. On the practice project I was using in Dreamweaver it showed fine in both Dreamweaver and browser. I am using the basic same format the practice project used.
I added your suggestion EDBR and it did nothing.
As far as:"its not in your styles. add it and it will work "
add what in my styles?
If I am missing something huge can you point me to a good tutorial?

The link you gave above have no styles. There's no CSS.

dloj333
09-12-2011, 06:03 PM
Thanks for all the input guys! You guys telling me there were no styles helped me when upon further investigation using Chrome I found that my stylesheet reference /styles/daone.css was incorrect. It should have been styles/daone.css.
Thanks again, well that is done. :)