Question

正如你所看到的，我有一个div（包含图片），它位于另一个div中。但为什么文本没有围绕div？为什么右侧有一些空间？ 1

非常感谢您的回答！

＆＃13;

#table {
  clear: both;
  float: right;
  margin-top: 100px;
  margin-right: 10px;
  min-width: 100px;
  min-height: 150px;
  background-color: rgb(230, 230, 230);
  border: 1px solid black;
  right: 0;
  align: right;
}
#body {
  background-color: white;
  border: 1px solid black;
  width: 50%;
  height: 95vh;
  margin: 0 auto;
  margin-top: 20px;
  z-index: 1;
}

＆＃13;

<body>
  <div id="article">Artikel</div>
  <div id="body">
    <div id="navigation">
      <br>
      <img src="../Logo/logomittext.svg" alt="SCHWIKI" width="100%">
      <br>
      <br>
      <a href="../index.html">Hauptseite</a>
      <br>
      <a href="Schwiki.html">Schwiki</a>
      <br>
      <a href="Änderungsprotokoll.html">Änderungsprotokoll</a>
      <br>
      <hr>
      <a href="LPI_Linux_Essentials.html">LPI Linux Essentials</a>
    </div>
    <div id="content">
      <h1>LPI Linux Essentials</h1>
      <div id="meta">
        <script language="Javascript" src="../Js/zulbearb.js">
        </script>
      </div>
      <hr>
      <div id="table">
        <img src="../Images/LPI-Essentials.jpg" alt="LPI-Essentials" width="300px">
        <table>
          <tr>
            <th>Aktuelle Version:</th>
            <td>1.5 (Prüfung 010-150)</td>
          </tr>
          <tr>
            <th>Voraussetzungen:</th>
            <td>keine</td>
          </tr>
          <tr>
            <th>Gültigkeit:</th>
            <td>Lebenslang</td>
          </tr>
        </table>
      </div>
      <p>Das Schwiki ist ein Nachschlagewerk für Themen, welche die Informationstechnologie betreffen. Es ist ein Pilotprojekt, das für die Verbesserung der Erfahrungen des Erstellers in Bezug auf das Erstellen von Websiten erstellt wurde.</p>
    </div>
  </div>
</body>

＆＃13;

Answer 1

margin-top: 100px;似乎是一个错字 - 也许你的意思是10px？进行更改，然后修复它。

此外，clear: both;，right: 0;和align: right;都可以删除，因为他们要么没有做任何事情，要么没有正确的语法。

在这里，我调整了CSS，并将左侧文本的数量增加了一倍，以便更容易包装。

＆＃13;

#table {
float: right;
margin-top: 10px;
margin-left: 10px;
min-width: 100px;
min-height: 150px;
background-color: rgb(230,230,230);
border: 1px solid black;
right: 0;
}
#body {
background-color: white;
border: 1px solid black;
width: 50%;
height: 95vh;
margin: 0 auto;
margin-top: 20px;
z-index: 1;
}

＆＃13;

<div id="article">Artikel</div>
    <div id="body">
        <div id="navigation">
            <br>
            <img src="../Logo/logomittext.svg" alt="SCHWIKI" width="100%">
            <br>
            <br>
            <a href="../index.html">Hauptseite</a>
            <br>
            <a href="Schwiki.html">Schwiki</a>
            <br>
            <a href="Änderungsprotokoll.html">Änderungsprotokoll</a>
            <br>
            <hr>
    <a href="LPI_Linux_Essentials.html">LPI Linux Essentials</a>
        </div>
        <div id="content">
            <h1>LPI Linux Essentials</h1>
            <div id="meta">
                <script language="Javascript" src="../Js/zulbearb.js">
                </script>
            </div>
            <hr>
    <div id="table">
                <img src="../Images/LPI-Essentials.jpg" alt="LPI-Essentials" width="300px">
                <table>
                    <tr>
                        <th>Aktuelle Version:</th>
                        <td>1.5 (Prüfung 010-150)</td>
                    </tr>
                    <tr>
                            <th>Voraussetzungen:</th>
                            <td>keine</td>
                    </tr>
                    <tr>
                            <th>Gültigkeit:</th>
                            <td>Lebenslang</td>
                    </tr>
                </table>
            </div>
            <p>Das Schwiki ist ein Nachschlagewerk für Themen, welche die Informationstechnologie betreffen. Es ist ein Pilotprojekt, das für die Verbesserung der Erfahrungen des Erstellers in Bezug auf das Erstellen von Websiten erstellt wurde. Das Schwiki ist ein Nachschlagewerk für Themen, welche die Informationstechnologie betreffen. Es ist ein Pilotprojekt, das für die Verbesserung der Erfahrungen des Erstellers in Bezug auf das Erstellen von Websiten erstellt wurde.</p>
        </div>
    </div>

＆＃13;

在div周围包装文本并不起作用

1 个答案: