HTML文書の空白とアーティクルと脇にあるタグを削除します

Question

私は脇の空白を削除したいと思います。私はちょうどCSSを学び始めたので少し混乱しています。なぜ脇見タグが常に記事タグに触れているのか分かりません。

html, 
 
body { 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 
header, 
 
footer { 
 
    padding: 1em; 
 
    color: #FFFFFF; 
 
    background-color: black; 
 
    clear: left; 
 
    text-align: center; 
 
} 
 
nav { 
 
    float: center; 
 
    margin: 0 auto; 
 
    padding: 1em; 
 
    border-bottom: 2px solid black; 
 
    text-align: center; 
 
    background-color: #F0F0F0; 
 
} 
 
nav u1 { 
 
    list-style-type: none; 
 
    padding: 0; 
 
} 
 
aside { 
 
    float: right; 
 
    margin: 0; 
 
    padding: 2em; 
 
    padding-bottom: 290px; 
 
    color: #6A5ACD; 
 
    background-color: #F0F0F0; 
 
} 
 
article { 
 
    border-right: 1px solid gray; 
 
    margin-right: 170px; 
 
    padding: 1em; 
 
    overflow: hidden; 
 
    background-color: #F0F0F0; 
 
} 
 
#Tablas { 
 
    text-align: center; 
 
} 
 
a:link { 
 
    color: #6A5ACD; 
 
    background-color: transparent; 
 
    text-decoration: none 
 
} 
 
a:visited { 
 
    color: #4B0082; 
 
    background-color: transparent; 
 
    text-decoration: none 
 
} 
 
a:hover { 
 
    color: #483D8B; 
 
    background-color: transparent; 
 
    text-decoration: underline 
 
} 
 
a:active { 
 
    color: yellow; 
 
    background-color: transparent; 
 
    text-decoration: underline 
 
}

<div class="container"> 
 
    <header> 
 
    <h1>Guia HTML</h1> 
 
    <img src="images.jpg"> 
 
    </header> 
 
    <nav> 
 
    <u1> 
 
     <a href="#Tablas">Tablas</a> 
 
     <a href="#CSS">CSS</a> 
 
     <a href="#Etiquetas">Etiquetas</a> 
 
    </u1> 
 
    </nav> 
 

 
    <aside> 
 
    <u2> 
 
     <p><a href="http://www.w3schools.com/html/html_tables.asp">Guia HTML</a> 
 
     </p> 
 
     <p><a href="http://www.w3schools.com/html/html_css.asp">Guia CSS</a> 
 
     </p> 
 
    </u2> 
 
    </aside> 
 

 
    <article> 
 
    <h2 id="Tablas">Tablas</h2> 
 
    <iframe src="https://actualidad.rt.com/ " height="300" width="1050"></iframe> 
 

 
    </article> 
 

 
    <footer> 
 
    <p>Copyright © Escola del treball 6204578 mr.nombrefalso@gmail.com</p> 
 
    </footer> 
 
</div>

Answer 1

あなたはそれを削除し、余裕を持って記事の要素にCSSで指定されています。プロパティ「margin-right：170px;」を削除します。結果を確認してください。