Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
Formularz - Rozjężdżające się pola
#1
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 ?
Odpowiedz
#2
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]
Odpowiedz
#3
label {
display: block;


na

label {
display:inline-block
Odpowiedz
#4
Niestety nadal to samo.
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
  Jak zrobic Formularz Kontaktowy na stronie ? Kodarth 191 255,810 06-04-2021, 16:25
Ostatni post: zerin
  Walidacja zdjęć + formularz harvester2001 6 5,968 24-03-2014, 19:01
Ostatni post: harvester2001
  php formularz - wszystkie pola muszą być wypełnione d3d3d3 2 3,633 01-10-2013, 14:16
Ostatni post: Kartofelek
  [PHP] Formularz mailowy - wysyłanie wiadomości spolprog 7 6,484 05-09-2013, 17:13
Ostatni post: Engine
  Pewny formularz and licznik JOzEk 1 2,343 04-05-2013, 14:35
Ostatni post: Engine

Skocz do:


Użytkownicy przeglądający ten wątek: 1 gości
Sponsorzy i przyjaciele
SeoHost.pl