CODEWITHSUNDEEP
cssbackground
InsidetheBlimp
InsidetheBlimp

Reputation: 1

Why is it when I use background: url() my image never shows?

I have spent way to long trying to figure out why my code isn't executing the background: url() correctly. My image "beardlawyer.jpg" is in the same folder as my html and css file.

Things I've tried already:

background: url("/Best Lawyer Website/beardlawyer.jpg");

background: url('beardlawyer.jpg');

background: url(/beardlawyer.jpg);

background: url('/beardlawyer.jpg);

And to be honest I don't understand why people either use the ' mark or the " inside the parentheses.

actual html

<section id="showcase">
        <div class="container">
            <h1> Experienced lawyers at a moments notice </h1>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
        </div>
    </section>

The CSS at the moment

#showcase {
    min-height: 200px;
    background:url("/Best Lawyer Website/beardlawyer.jpg");
}

Upvotes: 0

Views: 141

Answers (1)

Coffee bean
Coffee bean

Reputation: 1504

Use background-image and specify a width and height on the element.

#showcase {
    min-height: 200px;
    width: 100%;
    height: auto;
    background-image: url("https://source.unsplash.com/random");
}
<div id="showcase"></div>

Upvotes: 1

Related Questions