「スパン」セレクタが機能しない

Question

私はH1の周りに境界線を作成しようとしていますが、何らかの理由でCSSの正確な「スパン」を選択できません。私は何かを間違って書きましたか？

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>

Answer 1

あなたはborderが仕事させませんpadding後;を、欠けている

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>

この質問はもはや再現できない問題や、単純なタイプミスによって引き起こされたよう

Answer 2

CSS

span.classy { 
    background-color: DodgerBlue; 
} 

HTML

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