Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Colin Hightower
2,948 Pointspic on About page : there's no white space between top of the pic and bottom of green header???
I've got no white space between the top of my uploaded picture and the green banner, and I need the white space (padding)
my Problem:
/green banner at top goes here/ /picture/
the CSS code for the space between them wasn't being applied and i copied nick's code and finished the video
I need this to happen:
/green banner at top goes here/
/picture/
MY CODE below:
.profile-photo { clear:both; display:block; max-width: 150px; margin: 20px auto 30px; border-radius: 20px; }
3 Answers
Bertan Ulusoy
18,047 PointsHi Colin, What is your "header" element css? It should like this;
header{ float:left; margin:0 0 30px 0; padding: 5px 0 0 0; width: 100%; }
margin: 0 0 30px 0 -> should make a bottom margin with 30px at header DOM element.
Colin Hightower
2,948 Points/******************************************* GENERAL ********************************************/
body {
font-family: 'Open Sans', sans-serif;
}
wrapper {
max-width: 940px; margin: 0 auto; padding: 0 5%; }
a { text-decoration: none; }
img { max-width: 100%; }
h3 { margin: 0 0 1em 0; }
/******************************************* HEADING ********************************************/
header { float: left; margin: 0 0 30x 0; padding: 5px 0 0 0; width: 100%; }
logo {
text-align: center; margin: 0; }
h1 { font-family: 'Changa One', sans-serif; margin: 15px 0; font-size: 1.75em; font-weight: normal; line-height: 0.8em; }
h2 { font-size: 0.75em; margin: -5px 0 0; font-weight: normal; }
Bertan Ulusoy
18,047 PointsDid you see your syntax mistake at header element css?
header { float: left; margin: 0 0 30x 0; padding: 5px 0 0 0; width: 100%; }
You wrote 30x at margin property. It should be 30px.
That's why bottom margin does not work.