• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Wyrównanie tekstu w formularzu

VPS Starter Arubacloud
+2 głosów
1,969 wizyt
pytanie zadane 23 stycznia 2017 w HTML i CSS przez Patryk Sadkowski Nowicjusz (220 p.)

Witam otóż w jaki inny sposób można wyrównać równo pod sobą tekst z "input blokami" tak żeby to wyglądało estetycznie prócz tabel. 

HTML

<!DOCTYPE html>
<html lang="pl">
<head>
	<title>ADD USER</title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

<div id="container">
<div id="add_user">

<form>
	<h2>DODAWANIE UŻYTKOWNIKA</h2>

	Nazwa Użytkownika: <input type="text" name="uid">
	Hasło: <input type="password" name="pwd">
	<div class="clear"></div>

	Imię: <input type="text" name="first">
	Nazwisko: <input type="password" name="last">
	<div class="clear"></div>

	E-mail: <input type="text" name="mail">
	PESEL: <input type="date" name="PESEL">
	<div class="clear"></div>

	<button>DODAJ UŻYTKOWNIKA</button> <button>ZRESETUJ</button>
</form>

</div>
</div>


</body>
</html>

CSS

* {
	margin: 0;
	padding: 0;
	font-family: Arial;
	color: white;
}

.clear {
	clear: both;
}

#container {
	width: 960px;
}

#add_user {
	outline-width: 
	padding: 10px;
	border: 1px black solid;
	background-color: #222222;
}

#add_user > h2 {
	text-align: center;
}

#add_user > form >  button {
	color: black;
}

#add_user > form > input {
	width: 200px;
}

 

2 odpowiedzi

+1 głos
odpowiedź 23 stycznia 2017 przez xmentor Nałogowiec (49,520 p.)

inputy powinny mieć etykiety - znacznik label https://developer.mozilla.org/pl/docs/Web/HTML/Element/label

Możesz np. wziąć każdy input wraz z etykieta w diva.

+1 głos
odpowiedź 23 stycznia 2017 przez mtk3d Nałogowiec (46,690 p.)

Poczytaj o grid system w css, ładny układ i responsywność za jednym zamachem. Polecam ten z W3CSS, bardzo prosty i intuicyjny.

I tak jak napisał kolega xmentor zawsze dawaj label.

komentarz 23 stycznia 2017 przez xmentor Nałogowiec (49,520 p.)

Polecam ten z W3CSS, bardzo prosty i intuicyjny.

A ja nie polecam :D

komentarz 23 stycznia 2017 przez mtk3d Nałogowiec (46,690 p.)
Może rozwiń, bo to co napisałeś nic nie wnosi.
komentarz 23 stycznia 2017 przez xmentor Nałogowiec (49,520 p.)
Można wyszukać coś lepszego niż 'framework' od W3Schools.

http://forum.pasja-informatyki.pl/34559/w3schools-nie-szerzmy-falszywej-propagandy
komentarz 24 stycznia 2017 przez mtk3d Nałogowiec (46,690 p.)
No i następnym razem od razu tak rozwijaj.

Wiem o tym, że to nie ma nic wspólnego z W3C, ale spełnia swoje zadania, jest bardzo intuicyjny, lekki i prosty w nauce, dla małych projektów idealny. Więc czemu z niego nie korzystać?

Podobne pytania

0 głosów
2 odpowiedzi 1,203 wizyt
pytanie zadane 3 sierpnia 2016 w HTML i CSS przez alus152 Bywalec (2,690 p.)
0 głosów
4 odpowiedzi 12,370 wizyt
pytanie zadane 8 października 2016 w HTML i CSS przez redstar1 Bywalec (2,200 p.)
0 głosów
2 odpowiedzi 1,741 wizyt

93,023 zapytań

141,986 odpowiedzi

321,288 komentarzy

62,369 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 2

Można już zamawiać tom 2 książki "Wprowadzenie do bezpieczeństwa IT" - będzie to około 650 stron wiedzy o ITsec (17 rozdziałów, 14 autorów, kolorowy druk).

Planowana premiera: 30.09.2024, zaś planowana wysyłka nastąpi w drugim tygodniu października 2024.

Warto preorderować, tym bardziej, iż mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy dodatkowe 15% zniżki! Dziękujemy zaprzyjaźnionej ekipie Sekuraka za kod dla naszej Społeczności!

...