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;
  }

Meer tonen

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

Port Father: beta van een browsergame in Antwerpen 1931, feedback welkom

Maffia Hotel: een browsergame waarin je van lobbygast naar spil van het hotel groeit

Crime Club volledig herschreven vanaf nul

Malavita (nieuwe maffia game, van 0)

Herkent deze Notion-structuurscan echte problemen?

🚀 WE ZOEKEN TESTERS! 🚀

Luchtvaartsoftware: Hoe technologie de moderne luchtvaart verandert

Hoe gebruiken jullie WhatsApp voor marketing en klantopvolging?

[TE KOOP] Malavita.be [Maffiaspel, gebaseerd op omicidio.nl, unieke code]

TK: Kraai.eu

[TE KOOP] Likeboost24.nl: complete SMM-webshop met eigen merk, volautomatische levering en betalen op de eigen pagina

Checkbox margin

Registratie

PHP waarschuwt voor twee ernstige bugs die makkelijk uit te buiten lijken

Functioneel ontwerp

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

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

Gebruikers die dit topic bekijken