About
Pricing
Community
Teams
Start Free Trial
Log in
adimit19
asked on
3/11/2012
HTML: COLUMNS NOT APPEARRING AS EXPECTED
In the following code, I expect one row of 7 columns, and a second row right below it of 1 column.
Here is the HTML:
<div id="footer_wrapper">
<div id="footer1">
<div id="footer1_col1"></div>
<div id="footer1_col2"></div>
<div id="footer1_col3"><a>vv</a
></div>
<div id="footer1_col4"><a>cc</a
></div>
<div id="footer1_col5"><a>dd</a
></div>
<div id="footer1_col6"></div>
<div id="footer1_col7"></div>
</div><!-- end footer1 -->
<div id="footer2"></div><!-- end footer2 -->
</div> <!-- end footer_wrapper -->
What I get are three one column rows. Why is that?
CSS:
#footer_wrapper {
width: 1018px;
height: 45px;
margin: 0 auto;
border:5px;
}
#footer1{.footer;}
#footer2{.footer;}
#footer1_col1{.footer_Outs
ideColumn_
noText;}
#footer1_col2{.footer_Outs
ideColumn_
noText;}
#footer1_col3{.footer_Outs
ideColumn_
withText;}
#footer1_col4{.footer_Outs
ideColumn_
withText;}
#footer1_col5{.footer_Outs
ideColumn_
withText;}
#footer1_col6{.footer_Outs
ideColumn_
noText;}
#footer1_col7{.footer_Outs
ideColumn_
noText;}
#footer1_col3 a{.footer_OutsideColumnTex
t;}
#footer1_col4 a{.footer_OutsideColumnTex
t;}
#footer1_col5 a{.footer_OutsideColumnTex
t;}
.footer {
background: url(../images/spacers/Whit
eSpacer.pn
g) repeat;background-position
:center;
width:1014px;
height:45px;
margin:0 auto;padding:0;
float:left;
border-color:0;
left:50%;
margin-left: -507px; /* 50% of the div's width*/
}
.footer_OutsideColumn_noTe
xt{
width:145px;
height:45px;
margin:0 auto;
padding:0;
text-align:left;
float:left;
background: url(../images/spacers/Whit
eSpacer.pn
g) repeat;background-position
:center;
}
.footer_OutsideColumn_with
Text{
width:145px;
height:45px;
margin:0 auto;
padding:0;
text-align:left;
float:left;
background: url(../images/spacers/Whit
eSpacer.pn
g) repeat;background-position
:center;: url(../images/headings/Foo
ter_Headin
g1_Underli
ne.png) no-repeat;background-posit
ion:center
;
}
.footer_OutsideColumnText{
text-align:left;
font-family:"Myriad Pro";
font-size:12px;
color:#b82323;
height:45px; line-height:45px;
margin-left: 45px;
}
HTML
CSS
3
2
Last Comment
adimit19
8/22/2022 - Mon
SOLUTION
Kyle Hamilton
3/11/2012
THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
ASKER CERTIFIED SOLUTION
Kyle Hamilton
3/11/2012
THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
adimit19
3/11/2012
ASKER
looks good. Thx
I started with Experts Exchange in 2004 and it's been a mainstay of my professional computing life since. It helped me launch a career as a programmer / Oracle data analyst
William Peck