jeudi 4 février 2016

Getting a form next to a div

I've been trying to get my form next to my div which contains text. But these two will not stand next to each other did I miss anything? Because there still standing on top of each other. I've tried it without using bootstrap but still got the same result.

The Code:

.footer-text {
  float: left !important;
  color: green;
}
.aanmelden {
  float: right !important;
  color: white;
}
.form-control {
  width: 66% !important;
}
input {
  margin-top: 5px;
  margin-bottom: 5px;
  display:inline-block;
  *display: inline;     /* for IE7*/
  zoom:1;              /* for IE7*/
  vertical-align:middle;
  margin-left:20px;
}
label {
  display:inline-block;
  *display: inline;     /* for IE7*/
  zoom:1;              /* for IE7*/
  float: left;
  padding-top: 5px;
  text-align: right;
  width: 140px;
  margin-right: 20px;
}
<div class="footer row">
  <div class="footer-text col-md-6">
    <h2>Agenda <br>
      waar en wanneer?</h2>

    <p>Zaterdag 6 / Zondag 7 September
      Locatie: nog niet bekend
      Aanwezig: 8.45uur</p>
    <p>Zaterdag 13 / Zondag 14 Oktober
      Locatie: nog niet bekend
      Aanwezig: 8.45uur</p>
    <p>Zaterdag 13 / Zondag 14 Oktober
      Locatie: nog niet bekend
      Aanwezig: 8.45uur</p>
  </div>
  <div class="aanmelden col-md-6">
    <form action="">
      <h3>INSCHRIJVEN <br>
        MELD JEZELF HIER AAN</h3>
      <div class="form-group">
        <label for="voornaam">Voornaam</label>
        <input type="text" name="voornaam" id="voornaam" placeholder="voornaam" class="form-control">
      </div>
      <div class="form-group">
        <label for="achternaam">Achternaam</label>
        <input type="text" name="achternaam" id="achternaam" placeholder="achternaam" class="form-control">
      </div>
      <div class="form-group">
        <label for="datum-cursus">Datum cursus</label>
        <input type="date" name="datum-cursus" id="datum-cursus" class="form-control">
      </div>
      <div class="form-group">
        <label for="opmerking">Opmerking</label>
        <textarea name="opmerking" id="opmerking" cols="30" rows="10" placeholder="Plaats hier uw opmerkingen!" class="form-control"></textarea>
      </div>
      <input type="submit" class="btn btn-primary">
    </form>
  </div>
</div>



Aucun commentaire:

Enregistrer un commentaire