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

HTML

Posted by Harrison Court
Harrison Court
4,232 Points

Background Loop

My website that I am making has a loop in it when the browser is not full screen. Any idea how to get rid of it?

What I see: http://imgur.com/Mg5zTaR

HTML:

<!DOCTYPE html>
    <html>
        <body>
            <head>
                <link rel="stylesheet" type="text/css" href="css/main.css">
            </head>
            <div id="rule-title">
                <h1>Slick Servers Rule Page</h1>
                <p>This page is still in development, please report any bugs on our forums.</p>
            </div>
        <div id="rule-list">
            <div class="rule">
                <h3>General Rules</h3>
            </div>
            <div class="rule">
                <h3>Building Rules</h3>
            </div>
            <div class="rule">
                <h3>Job Rules</h3>
                 </div>
            </div>
        </body>
    </html>

CSS: 

.rule {
    margin: 10px;
    background-color: aliceblue;
    padding: 5px;
    border-radius: 10px;
}

html {
    background-image: url("https://goo.gl/jybrTz");
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

2 Answers

Moritz Lang
Moritz Lang
25,909 Points

Hi Harry, do you mean the background image?

If so, you can easily add the following line to your CSS:

background-repeat: no-repeat;

I would also change html to body in your CSS, as you don't want to style the HTML, rather the body of your website.

Harrison Court
Harrison Court
4,232 Points
Harrison Court
Harrison Court
4,232 Points

Thank you!