删除文章和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;”并检查结果。