- This topic is empty.
-
AuthorPosts
-
September 30, 2010 at 7:48 pm #30405MaskdTuxMember
Well I have ran into a weird problem. I have written the rough draft for a new site and ran into a wall at the footer. This is the first time I am using html5 and css3.
My problem is the background color isn’t appearing in Firefox. I have looked over my code a bunch of times and can’t find what could be the problem. I’m sure it is something simple but I could use some help.
I have tested it in Safari, Chrome, and even IE. But for some reason it isn’t showing up in Firefox.
Red ADvenir
News
Missionary Volunteers in Action
God has been gracious in sending missionaries from around the world to help finish this building project on time for satellite broadcasting. Read about God’s perfect timing in organizing has warriors.
Current Broadcasts
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
And the css….
/*
Colors:
Dark Blue: #040b41
Light Blue: #33aadd
Purple: #412366
Off-white: #f4f0e6
Light Grey: #f5f2e7
Add Size:
Aside: 260×125
Main: 1000x ?
Content Top 615x190 ?
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
html { background-color: #eeeeff; font-family: Verdana, Arial, Helvetica, sans-serif; }
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
width: 1000 px;
}
ol, ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
p { font-size: 12px; padding-bottom: 12px; }
h1 { font-size: 22px; padding-bottom: 22px; }
h2 { font-size: 18px; padding-bottom: 14px; }
.clear { clear: both }
/*Content Style*/
#page-wrap { position: relative; width: 1000px; margin: auto; background: #ffffff; }
nav ul { position: relative; top: -1px; list-style-type: none; background: #383d3f url(../images/nav-bg.gif); height: 33px; width: 1000px; margin-bottom: 10px; }
nav li { float: left; }
nav ul a {
background-repeat: no-repeat;
background-position: right;
padding-right: 13px;
padding-left: 13px;
display: block;
line-height: 32px;
text-decoration: none;
font-size: 14px;
color: #040b41;
}
nav ul a:hover { color: #412366; }
#search {
position: relative;
right: 25px;
top: 5px;
float: right;
color: #666666;
line-height: 21px;
width: 185px;
padding-left: 10px;
padding-bottom: 0px;
background-color: white;
border: #CCCCCC 1px solid;*/
}
aside {
position: relative;
display: block;
right: 10px;
float: right;
padding: 10px;
width: 280px;
height: 500px;
background: #f5f2e7;
}
.shadow {
-moz-box-shadow: 5px 5px 5px #ccc;
-webkit-box-shadow: 5px 5px 5px #ccc;
box-shadow: 5px 5px 5px #ccc;
}
figure img {
margin: 20px 42px;
}
#news {
position: relative;
display: block;
float: left;
margin: 10px;
padding: 10px;
width: 250px;
height: 215px;
}
#broadcast {
position: relative;
display: block;
float: right;
margin: 10px;
padding: 10px;
width: 350px;
height: 215px;
}
.banner {
height: 32px;
line-height: 30px;
padding: 0 10px;
margin-bottom: 10px;
font-size: 26px;
font-family: "ff-nuvo-sc-web-pro-1","ff-nuvo-sc-web-pro-2", verdana;
color: #33aadd;
background: #040b41;
}
footer {
position: relative;
desplay: block;
margin-top: 10px;
color: #ffffff;
background: #33aadd;
}September 30, 2010 at 8:02 pm #78654BarspinParticipantclearfix maybe?
September 30, 2010 at 8:12 pm #78652MaskdTuxMemberThanks Barspin, clearfix worked.
If possible could someone explain why it worked? I can’t figure it out.September 30, 2010 at 8:14 pm #78655coffeendonutMembersee in your CSS code you have
footer {
position: relative;
desplay: block;
margin-top: 10px;
color: #ffffff;
background: #33aadd;
}
you just got display: block; wrong you put an “e” instead of an “i”
September 30, 2010 at 8:26 pm #78656MaskdTuxMemberhehe,
Thanks a bunch coffeendonut, that also fixed it.I think it’s time for bed :P.
Is it worth using clearfix over a extra div?
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.