Formularz - Rozjężdżające się pola - hghormone - 05-03-2011
Witam.
Mam problem z prostym formularzem:
HTML:
Kod: <!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<meta />
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<form action="wpis.php" method="post">
<label>Data przyjęcia:</label> <input type="text" name="data_przyjecia" class='i1'><br>
<label>Model:</label> <input type="text" name="model" class='i1'><br>
<label>Nr imei:</label> <input type="text" name="nr_imei" class='i1'><br>
<label>Lock/Soft:</label><input type="radio" name="radio_lock" value="rlock" class='i1'><br>
<label>Naprawa:</label><input type="radio" name="radio_naprawa" value="rnaprawa" class='i1'><br>
<label>Uwagi:</label> <input type="text" name="uwagi" size="70" class='i1'><br>
<label>Nr tel.:</label> <input type="text" name="nr_tel" class='i1' ><br>
<label>Status:<form action="?"><div>
<select class='i1'>
<option>Punkt</option>
<option>Serwis</option>
<option>Serwis<---Punkt</option>
<option>Klient</option>
</select>
</div></form>
<label>Cena A (Punkt):</label> <input type="text" name="cena_a" class='i1' ><br>
<label>Cena B (Serwis):</label> <input type="text" name="cena_b" class='i1' ><br>
<label></label><input type="submit" value="Wyślij" style="margin: 2px 4px 0px 4px;">
</form>
</body>
</html>
CSS:
Kod: h1 {
text-align: center;
}
table {
width: 78%;
margin: 0 auto;
table-layout: fixed;
}
table thead {
background: #000;
color: #fff;
}
table tbody {
background: transparent;
color: #000;
}
table tfoot {
background: #525252;
color: #fff;
text-align: right;
}
table tfoot a:link, table tfoot a:visited {
color: #fff;
text-decoration: underline;
}
table tfoot a:hover {
color: #fff;
text-decoration: none;
}
table tbody tr:hover {
background: #FFE9A0;
}
table tbody tr:nth-child(even) {
background: #EBEBEB;
}
table tbody tr:nth-child(odd) {
background: #D6D6D6;
}
table tbody tr:hover {
background: #FFE9A0;
}
label {
display: block;
width: 150px;
float: left;
margin: 2px 4px -1px 4px;
text-align: right;
}
caption {
font-size: 40px;
font-style: normal;
}
td {
padding:0px 0px;
margin: 10px
}
.i1 {
background-color:#EBEBEB;
border: 1px solid #006;
margin: 2px 4px 0px 4px;
}
.k_pozycja{
width:4% ;overflow:hidden;
}
.k_data_przyjecia{
width:9% ;overflow:hidden;
}
.k_model{
width:13% ;overflow:hidden;
}
.k_nr_imei{
width:10% ;overflow:hidden;
}
.k_lock{
width:4% ;overflow:hidden;
}
.k_naprawa{
width:4% ;overflow:hidden;
}
.k_uwagi{
width:15% ;overflow:hidden;
}
.k_nr_tel{
width 15% ;overflow:hidden;
}
k_status{
width 15% ;overflow:hidden;
}
k_cena_a{
width 1% ;overflow:hidden;
}
k_cena_b{
width 1% ;overflow:hidden;
}
.k_czynnosc{
width 9% ;overflow:hidden;
}
Problemem są pola "Naprawa" i Uwagi ponieważ nie stoją one równo w rzędzie z innymi pozycjami, tylko są poprzesuwane w prawo.
Jaka jest tego przyczyna ?
RE: Formularz - Rozjężdżające się pola - hghormone - 05-03-2011
Udało mi się rozwiązać problem, wystarczyło przerobić kod tak :
Kod: <label>Lock/Soft:</label><input type="radio" name="radio_lock" value="rlock" class='i2'><br>
<label>Naprawa:</label><input type="radio" name="radio_naprawa" value="rnaprawa" class='i2'><br>
a w CSS dodać:
Kod: .i2 {
background-color:#EBEBEB;
margin: 2px 4px 6px 4px;
}
Ale pojawił się następny problem ponieważ nie wiem jak ustawić w jednej lini powyższe 2 radio buttony ?
Próbowałem usuwać znacznik "<br>", ale nie pomaga wtedy 2 labele sa obok siebie a dopiero koło nich 2 radio buttony.
Kto wie jak ustawić to prawidłowo tzn. LABEL1>>RADIOBUTTON1 i obok w tej samej linii LABEL2>>RADIOBUTTON2 ?[/code]
RE: Formularz - Rozjężdżające się pola - Kartofelek - 05-03-2011
label {
display: block;
na
label {
display:inline-block
RE: Formularz - Rozjężdżające się pola - hghormone - 05-03-2011
Niestety nadal to samo.
|