I've looked at many, many links trying to figure this one out. Despite trying tonnes of variations of the CSS, I can't for the love of god get checkboxes to 1) align next to the labels instead of above them, 2) appear on the right side of the labels.
My website: http://ift.tt/1ATMgMR
My code
.formula1 {
margin:auto;
position:relative;
max-width:450px;
height:450px;
padding:10px;
border: 1px solid #999;
border: inset 1px solid #333;
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}
.inline-field input,
.inline-field label {
display: inline-block;
margin-bottom: 0; /* I added this after I posted my reply */
vertical-align: middle; /* Fixes any weird issues in Firefox and IE */
</style>
<form name="nexus" class="formula1">
<div class="inline-field">
<input type="checkbox" id="chk_1" name="chk_1" value="Fokalneurologi finns" onchange="checkTotal()" /><label for="chk_1">Fokalneurologi finns</label></div>
<div class="inline-field"><input type="checkbox" id="chk_2" name="chk_2" value="Ömhet över spinalutskott" onchange="checkTotal()"/><label for="chk_2">Ömhet över spinalutskott</label></div>
<div class="inline-field"><input type="checkbox" id="chk_3" name="chk_3" value="Påverkat medvetande" onchange="checkTotal()"/><label for="chk_3">Påverkat medvetande</label></div>
<div class="inline-field"><input type="checkbox" id="chk_4" name="chk_4" value="Intoxikering" onchange="checkTotal()"/><label for="chk_4">Intoxikering</label></div>
<div class="inline-field"><input type="checkbox" id="chk_5" name="chk_5" value="Distraherande skada finns" onchange="checkTotal()"/><label for="chk_5">Distraherande skada finns</label></div>
<input type="text" size="50" name="total" value="Röntgen är inte indicerat enl. NEXUS-kriterer"/>
</form>
Aucun commentaire:
Enregistrer un commentaire