Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

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

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.

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.