CODEWITHSUNDEEP
htmlcss
Eli M
Eli M

Reputation: 15

"Span" Selector not working

I am trying to build a border around my H1 but for some reason i can't select the exact "span" in css? Have i written something incorrectly?

HTML

    h1 span {
    
      display: inline-block;
      padding: 0.5em
      border: white solid 10px;
    }
<header>
  <div class="logo">
    <img src="octopus.png">
  </div>

  <nav>
    <a href="">One</a>
    <a href="">One</a>
    <a href="">One</a>
    <a href="">One</a>
  </nav>
  <h1><span>Elias</span></h1>
  <p class="kicker">Stuff // Other Stuff // More</p>
</header>

Upvotes: 0

Views: 531

Answers (2)

Razia sultana
Razia sultana

Reputation: 2211

CSS

span.classy {
  background-color: DodgerBlue;
}

HTML

<span class="classy">Here's a span with some text.</span>
<span>Here's another.</span>

Upvotes: 0

dippas
dippas

Reputation: 60563

you are missing a ; after the padding, which won't let border work

h1 span {
  display: inline-block;
  padding: 0.5em;
  border: white solid 10px;
}
/*demo*/

body {
  background: lightblue
}
<nav>
  <a href="">One</a>
  <a href="">One</a>
  <a href="">One</a>
  <a href="">One</a>
</nav>
<h1><span>Elias</span></h1>
<p class="kicker">Stuff // Other Stuff // More</p>

Upvotes: 1

Related Questions