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

CSS

Denis Zhidkov
Denis Zhidkov
2,660 Points

Delete margin on the top when the width of the browser is over 1000 px

Why do I have huge margin on the top when the width of the browser is over 1000 px? Screenshot: https://yadi.sk/i/7zjrymiymQxe2

I tried to add this to css file and responsive file, but it didnt help...

body { margin: 0; padding: 0; }

Web-page: http://vote.hooters.com.ru/thanks.html

And how can I make background image to fit the the browser (width and height 100%)?

2 Answers

Justin Iezzi
Justin Iezzi
18,199 Points

Hi Denis,

You have an entire div that's taking that space, namely the row-fluid thanks class div . I'm not entirely sure why it's appearing there, but that's what is causing it.

About your background image, it sounds like you want to use the background-size: cover; property.

Denis Zhidkov
Denis Zhidkov
2,660 Points

Hi Justin,

I deleted this div, however it didn't help. Uploaded new html file http://vote.hooters.com.ru/thanks.html

It's strange because its appearing only when I the width is over 1000px.

Justin Iezzi
Justin Iezzi
18,199 Points

I still see the div, and what I delete the element itself from the inspector it fixes the height issue. I'm not able to see any images except for the logo, but Ron has some good points regarding your responsive.css. You'll have to slowly go through it and clean up those values.

Ron Starski
Ron Starski
1,997 Points

Denis, That huge margin comes from margin-top property in responsive.css file. Look for it in various media queries and set it to smaller values or even 0. What's more important, put class="wallpaper" on body tag and remove it from div, then you will be able to remove that horrible min-height from various media queries. Remove that fixed min-height from everywhere in responsive.css file, you no longer needs it when wallpaper will be set on body element.