CODEWITHSUNDEEP
htmlcsswebkitgradient
Senpai Saitama
Senpai Saitama

Reputation: 313

Gradient background of a div doesn't show up if I have text?

I'm trying to make tags for an Enjin website (Two, actually). I'm trying to make a gradient with a gradiented text inside it, but it isn't working. This is my code:

#ownerheaven {
    width: 120px;
    height: 30px;
    background: linear-gradient(#00A6FF, #0033FF);
    border-radius: 60px;
}
#owner_heaven_text {
    font-size: 20px;
    padding: 0;
    margin: 0;
}
<div id="container">
    <div id=" heaven"></div>
        <div id="owner_heaven">
            <h1 id="owner_heaven_text">OWNER</h1>
        </div>
    <div id="dragon">
        <div id="owner_dragon"></div>
    </div>
</div>

Thanks in advance for any help :)

Upvotes: 0

Views: 34

Answers (1)

kzhao14
kzhao14

Reputation: 2630

You forgot a _ in your CSS for #owner_heaven.

#owner_heaven {
    width: 120px;
    height: 30px;
    background: linear-gradient(#00A6FF, #0033FF);
    border-radius: 60px;  
}
#owner_heaven_text {
    font-size: 20px;
    padding: 0;
    margin: 0;
}
<div id="container">
    <div id=" heaven"></div>
        <div id="owner_heaven">
            <h1 id="owner_heaven_text">OWNER</h1>
        </div>
    <div id="dragon">
        <div id="owner_dragon"></div>
    </div>
</div>

Upvotes: 3

Related Questions