Question

我希望彼此相邻的两个div。我已经尝试了WebKit.WebKitBrowser browser = new WebKit.WebKitBrowser();，但它没有用。

我有基础，但大部分时间都使用我自己的CSS

＆＃13;

floating

＆＃13;

.mijn_producten{
    border-style: solid;
    border-color: #dddddd;
    margin-left: 60%;
    margin-right: 5%;
    margin-top: 50px;
    background: white;

}
.contact_gev{
    border-style: solid;
    border-color: #dddddd;
    margin-left: 5%;
    margin-right: 50%;
    margin-top: 50px;
    margin-bottom: 50px;
    background: white;
}
.contact_gev h1{
    margin-left: 5%;
}
.contact_gev p{
    margin-left: 5%;
    margin-top: 10%
}
.background_content{
    background: #f9f9f9;
    margin-left: 2%;
    margin-right: 2%;
    padding-top: 1%;
    padding-bottom: 1%;
}

＆＃13;

在这里你可以看到我的代码我已经使用左右浮动和所有位置变体

Answer 1

从机器人侧移除左右边距在两个元素上添加浮动，然后给出宽度，例如50％。

HTML

<div class="background_content">
  <div class="contact_gev">
    <h1>Contact gegevens</h1>
    <form>
      <p>Gebruikersnaam:
        <input class="registreren" type="text" name="Gebruikersnaam">
      </p>
      <p>Voornaam:
        <input class="registreren" type="text" name="voornaam">
      </p>
      <p>Achternaam:
        <input class="registreren" type="text" name="achternaam">
      </p>
      <p>Telefoonnummer:
        <input class="registreren" type="text" name="telefoonnummer">
      </p>
      <p>Geboorte datum:
        <input class="registreren" type="text" name="geboortedatum">
      </p>
      <p>Adres:
        <input class="registreren" type="text" name="adres">
      </p>
      <p>Postcode:
        <input class="registreren" type="text" name="postcode">
      </p>
      <p>plaats:
        <input class="registreren" type="text" name="plaats">
      </p>
      <p>land:
        <input class="registreren" type="text" name="land">
      </p>
    </form>
  </div>
  <div class="mijn_producten">
    <h1> Mijn producten</h1>
  </div>
</div>

CSS

.mijn_producten {
  border-style: solid;
  border-color: #dddddd;
  width: 50%;
  float: right;
  margin-top: 50px;
  background: white;
  box-sizing: border-box;
}

.contact_gev {
  border-style: solid;
  border-color: #dddddd;
  margin-top: 50px;
  margin-bottom: 50px;
  background: white;
  width: 50%;
  float: left;
  box-sizing: border-box;
}

.contact_gev h1 {
  margin-left: 5%;
}

.contact_gev p {
  margin-left: 5%;
  margin-top: 10%
}

.background_content {
  background: #f9f9f9;
  padding-top: 1%;
  padding-bottom: 1%;
  overflow: hidden;
}

Demo

Div旁边的div没有使用浮动

1 个答案: