Checkbox margin

wimmpie

Hallo,

ik heb weeral een probleem met mijn script...
De checkbox op mijn registratiepagina heeft een grote margin links en rechts,
zoals hieronder op de foto...

nu heb ik echt geen enkel idee waaraan dit kan liggen...
Dit is de html code:

HTML

<html><head>  <link href="css/css.css" rel="stylesheet" type="text/css" media="screen">  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>  <script type="text/javascript">      function init () {        document.getElementById ('my_link').onclick = function () {            document.getElementById ('registreer').submit ();            return false;        }    }    window.onload = init;    </script></head><body>  <h1>registreren</h1>  <div style="width:49%; float:left;">  <h2>Algemene Voorwaarden</h2>  <ul>    <li>Het gebruik van bots of proxy's is verboden.</li><br>    <li>Maximum 1 account per persoon.</li><br>    <li>Volg altijd instructies van de crew op. Ga niet op een ongepaste manier in discussie met de crew.</li><br>    <li>Maak geen reclame voor andere websites.</li><br>    <li>Toon geen racistische, discriminerende of 18+ content op deze site.</li><br>    <li>Vraag nooit naar iemand zijn wachtwoord, een crewlid zal dit ook nooit vragen.</li><br>    <li>Accounts hacken, het misbruik maken van fouten in een spel is ten strengste verboden.</li><br>    <li>Legend of the samurai mag gebruik maken van cookies.</li><br>    <li><b>Door op Legend Of The Samurai in te loggen ga je automatisch akkoord met deze regels</b></li>  </ul>  </div>    <div style="width:50%; float:right;"> <form method="post" id="registreer">        <div><b>Gebruikersnaam:</b><br /><div class="login_div"><input type="text" name="login" size="24"/></div></div>        <div><b>Wachtwoord:</b><br /><div class="login_div"><input type="password" name="ww" size="24"/></div></div>        <div><b>Herhaal Wachtwoord:</b><br /><div class="login_div"><input type="password" name="hww" size="24"/></div></div>        <div><b>E-mail:</b><br /><div class="login_div"><input type="text" name="mail" size="24"/></div></div>        <div><input type="checkbox"><b>Ik heb de Algemene Voorwaarden gelezen en ben akkoord.</b></div>        <div class="login_div">          <div class="button" style="text-align: center;">          <a href="#" id="my_link">REGISTREER</a>          </div>        </div>      </form>  </div></body></html>

Ziet er iemand waaraan dit kan liggen?
Alvast bedankt

Edit:
om één of andere reden word mijn code opgeslagen zonder enters :s

eeyk

je moet

doen en dan met CSS de style aanpassen.

pekelterror

Helaas ontbreekt de CSS wat juist erg belangrijk is bij een fout met de opmaak.

Gezien het plaatje vermoed ik dat je opmaak hebt voor input, om zo gelijk de textbox en submit allemaal op 1 formaat te maken.
Een checkbox valt ook gewoon onder input, het gebruikt namelijk ook het input element.

Geef de checkbox opmaak door middel van een ID of Class, of indien er geen andere checkbox op je pagina komt gebruik iets als onderstaand:

PHP

input[type='checkbox']{
// Hier de opmaak voor je checkbox.
}

ismail123

Haal <div> en </div> uit de checkbox

wimmpie

Als ik de checkbox een class geef met als margin: 0px gebeurd er niks....
hier is de css

Code

body {
  background:transparent;
}


a {
  text-decoration: none;
  }
a:link {
  color: #ffffff;
  }
a:active {
  color: #ffffff;
  }
a:visited {
  color: #ffffff;
  }
a:hover {
  color: #e2d8ce;
  }
  
  
.intro_bg a {
  color: #000000;
  }


.intro_bg a:hover {
  color: #968d84;
  }


  
.content {
  width: 1000px;
  margin: 0px auto;
}
.title {
  font-family: Viner Hand ITC;
  color: #e2d8ce;
  font-size: 43px;
  text-align: center;
}


.page {
  background-image: url('../images/layout/bg.png');
  width: 802px;
  height: 614px;
  margin: auto;
}


.char {
  float: left;
  width: 422px;
  height: 614px;
  background-image: url('../images/layout/char.png');
  background-repeat: no-repeat;
  background-position: 20px 20px;
  
}


.intro_bg {
  padding-top: 30px;
  float:left;
}
.intro {
  font-family: Verdana;
  font-size: 13px;
  color: #000000;
  padding-left: 5px;
  padding-top: 7px;
  background-color: rgba(255, 255, 255, 0.324);
  width: 357px;
  height: 77px;
  border-radius:5px;
}


.reg_bg {
  background-color: rgba(255, 255, 255, 0.324);
  border-radius:5px;
  margin-top: 20px;
  float:left;
  width: 264px;
  height: 38px;
}
.reg {
  font-family: Verdana;
  font-size: 25px;
  font-weight: bold;
  color: #000000;
  padding-left: 5px;
  padding-top: 2px;
}


.login_font {
  font-family: Verdana;
  font-weight: bold;
  color: #000000;
  font-size: 14px;
  margin-bottom: 5px;
}


.login_div {
  background-color: rgba(255, 255, 255, 0.324);
  width: 357px;
  height: 77px;
  border-radius:5px;
  width: 182px;
  height: 22px;
}


.ww_font {
  margin-top: 5px;
  font-family: Verdana;
  font-weight: bold;
  color: #000000;
  font-size: 14px;
  margin-bottom: 5px;
}


input {
  background: transparent;
  border: transparent;
  width: 182px;
  height: 22px;
}
.login {
  font-family: Verdana;
  font-size: 17px;
  font-weight: bold;
  color: #000000;
  padding-left: 5px;
}


.screen_bg {
  float:left;
  width: 327px;
  height: 206px;
}


.screenbox {
  width: 357px;
  height: 206px;
  background-color: rgba(255, 255, 255, 0.324);
  border-radius:5px;
}
.screenbox img.screen{
  float: left;
  margin-left: 15px;
  width: 100px;
  height: 90px;
  border: 0px;
  margin-top: 10px;
}


.link {
  text-align: center;
  clear: both;
  font-size: 15px;
  font-family: Verdana;
  font-weight: bold;
  color: #ffffff;
  }


.footer {
  text-align: center;
  font-size: 14px;
  font-family: Verdana;
  color: #ffffff;
  margin-top: 5px;
  }


/* NU HET LIGHTBOX GEDEELTE*/


.close {
  font-family: Verdana;
  font-size: 20px;
  font-weight: bold;
  width: 50px;
  float: right;
  margin-top: 20px;
  margin-right: 5px;
  text-align: center;
  }
  
.close a:link {
  color: #000000;
  }
.close a:visited {
  color: #000000;
  }
.button a:hover {
  color: #968d84;
  }  
  
.framez {
  width: 760px;
  height: 550px;
  margin-top: 15px;
  margin-left: 20px;
  border: transparent;
  }


#test {
  position: absolute;
  background-image: url('../images/layout/bg.png');
  width: 802px;
  height: 614px;
  margin: 0px auto;
  margin-top: -654px;
  margin-left: 99px;
  display: none;
  }
  
/* NORMAL PAGE CSS */


h1 {
  font-family: Viner Hand ITC;
  text-transform: uppercase;
  margin-top: -10px;
  }
  
h2 {
  font-family: Verdana;
  }
  
div {
  font-size: 13px;
  font-family: Verdana;
  }  
  
.button a:link {
  color: #000000;
  }
  
.button a:visited {
  color: #000000;
  }


.button a:hover {
  color: #968d84;
  }  


.button {
  font-family: Verdana;
  font-size: 17px;
  font-weight: bold;
  color: #000000;
}


.checkbox {
  margin: 0px;
  }

Toon Meer

M.Beers

Je checkbox krijgt de breedte van het input veld mee...

Code

input {
  background: transparent;
  border: transparent;
  width: 182px;
  height: 22px;
}

om dit op te lossen zou je hiervan kunnen maken:

Code

input[type="text"], input[type="password"] {
  background: transparent;
  border: transparent;
  width: 182px;
  height: 22px;
}

ICTscripters

Dé plek voor IT

Dé plek voor IT

OS Vendetta gezocht

Fallen Kingdom Game

Crimora.nl

RPG game gebouwd met AI

(Verkoop) Criminals

Het Grote Vibe Code Topic

Ictscripters Chat

Het oorspronkelijke Criminals Script

Straatbaas.eu – complete Nederlandstalige en Engelstalige online maffia-RPG

306 Nieuwe Domeinnamen Juni 2026

4-letter domein: Togi.nl

Checkbox margin

Participate now!

Quanscient ontvangt €10M om AI- en kwantum-native hardware engineering te bevorderen - Tech.eu

Datalek bij leverancier Canvas - Universiteit van Amsterdam

Data privacy in 2026: Hoe de naleving van GDPR verandert

Functioneel ontwerp

Access Control List implementatie in PHP/MySQL - deel 1/2

Access Control List implementatie in PHP/MySQL - deel 2/2