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

Posted by Alexey Tseitlin
Alexey Tseitlin
5,866 Points

Background doesn't work....

Tried everything. Why is it not showing?

.wrapper {
    max-width:970px;
    margin: 0 auto;
}

.fields {
    background: #F7F7F7;
}

.block1 {
    float:right;
    max-width: 470px;
}

.block2 {
    float:left;
    max-width: 470px;
}

<!DOCTYPE HTML>

<html>
<head>
    <meta charset="utf-8">
    <title>Site</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/style2.css">
</head>

<body>
<div class ="wrapper">
<div class ="fields">
    <div class="block1">
        add a method called getTileCount that uses the for each loop you just learned to loop through the characters and increme
        </div>
    <div class="block2">
        А что будет, если плавающих блоков на странице несколько? Давайте добавим в нашу html-страницу еще один блок:
        </div>
</div>
</div>
</body>
</html>

2 Answers

Alexey Tseitlin
Alexey Tseitlin
5,866 Points

made it small.... still doesn't work(

William Li
William Li
Courses Plus Student 26,868 Points
William Li
William Li
Courses Plus Student 26,868 Points

that's because inner div does NOT inherit background style from its parent div, and in your html, the field div basically contains nothing except the two inner divs, plus that in the CSS file, background is the only style it has, of course it's showing nothing.

Also, in your html, you need to wrap your paragraph in p tags.

Alexey Tseitlin
Alexey Tseitlin
5,866 Points

How should i add it then? If i will add it separately there will be a gap in the middle

William Li
William Li
Courses Plus Student 26,868 Points
William Li
William Li
Courses Plus Student 26,868 Points

well, in this case, the quickest fix is:

.fields {
    background: #F7F7F7;
    overflow: hidden;
}
Emma Willmann
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Emma Willmann
Treehouse Project Reviewer
Emma Willmann
.a{fill-rule:evenodd;}techdegree seal-36
Emma Willmann
Treehouse Project Reviewer

In your html, remove the space after class. Should be: 

<body>
<div class="wrapper">
<div class="fields">