Sziasztok!
Nem régen kezdtem el tanulni egy képzésen, így lehet, hogy hülyeséget fogok kérdezni, de próba szerencse.
Checkboxot szeretnék formázni csak CSS segítségével. A feladat az lenne, hogy a checkbox legyen lekerekített és lila pipa kerüljön bele.
Ti hogy oldanátok ezt meg?
Jelenleg ott tartok, hogy egy div-be próbáltam belepakolni, a lekerekítése is megvan, viszont a label szövege belecsúszott a kis négyzetembe. A pipáról már nem is beszélek. Valamin nagyon elcsúsztam úgyérzem.
HTML kód:
<fieldset>
<legend>Opciók</legend>
<div id="c1"><input type="checkbox" name="news" value="yes" /></div>
<label>Feliratkozom a hírlevélre</label>
<div id="c2"><input required="required" type="checkbox" name="eula" value="yes" /></div>
<label>Elfogadom a feltételeket</label>
</fieldset>
Kód:
input[type=checkbox] {
display: none;
}
div[id=c1]+label{
margin: 0 0 0 325px;
width:10px;
height:10px;
border:1px solid #607d8b;
background:#fff;
border-radius: 2px;
}
div[id=c2]+label{
margin: 0 0 0 325px;
width:10px;
height:10px;
border:1px solid #607d8b;
background:#fff;
border-radius: 2px;
}
Könyvjelzők