| Autor | Zpráva | ||
|---|---|---|---|
| Tirus Profil |
#1 · Zasláno: 27. 4. 2011, 23:14:55
potřeboval bych v následující ukázce zarovnat inputy napravo jako je u jednoho nastavený float:right, ovšem nechci, aby mi to dával na nový řádek. Jak se to dá udělat prosím?
<style type="text/css">
<!--
#RoomManager .doorNumber, #RoomManager .keeper, #RoomManager .area {
margin:0;
padding: 0;
}
#RoomManager .doorNumber #doorNumber { margin-left:91px; }
#RoomManager .keeper #keeper { margin-left:50px; }
#RoomManager .area #area { float:right;}
#RoomManager .submit {
margin-left: 240px;}
#RoomManager {
width: 30%;
margin:0 0 0 30px;
}
-->
</style>
</head>
<body>
<form id="RoomManager" name="RoomManager" method="post" action="#">
<div>
<p class="doorNumber">Číslo dveří:
<input type="text" name="doorNumber" id="doorNumber" />
</p>
<p class="keeper">Správce místnosti:
<input type="text" name="keeper" id="keeper" /></p>
<p class="area">Pavilon/patro:
<input type="text" name="area" id="area" />
</p>
<p class="submit"><input name="submit" type="button" value="Zpracovat" /></p>
</div>
</form> |
||
| panther Profil |
#2 · Zasláno: 27. 4. 2011, 23:20:37
Tirus:
buď dej input před „popisek“, nebo nech plavat i „popisek“. Popisek je záměrně v uvozovkách, používej label. |
||
| Tirus Profil |
#3 · Zasláno: 27. 4. 2011, 23:23:18
panther:
ok, takže když to dám do label.. jak tedy pak pracovat s tím CSS? spadnu do stejného problému. Jde mi o to, aby ten input byl zarovnán úplně vpravo |
||
| panther Profil |
#4 · Zasláno: 28. 4. 2011, 07:30:01
Tirus:
tak znovu. Buď dej input před „popisek“, nebo nech plavat i „popisek“. Co je na tom nejasného? |
||
| Tirus Profil |
#5 · Zasláno: 28. 4. 2011, 14:50:27
panther:
omlouvám se, ale fakt už si nevím rady. Zkusil jsem to tak jak jsi psal, ale nebyl jsem toho schopnej docílit. Tak bych se rád zeptal, jak to nastylovat když využívám tedy label <form id="RoomManager" name="RoomManager" method="post" action="#"> <div> <label for="doorNumber">Číslo dveří: </label> <input type="text" name="doorNumber" id="doorNumber" /> <label for="keeper">Správce místnosti: </label> <input type="text" name="keeper" id="keeper" /> <label for="area">Pavilon/patro:</label> <input type="text" name="area" id="area" /> <input name="submit" type="submit" value="Zpracovat" /> </div> </form> zde se mi to dá do jednoho řádku.. a když to začnu floutovat, tak se to rozhází. Takovéto pozicování už fakt není má silná stránka |
||
| BigBear Profil |
#6 · Zasláno: 28. 4. 2011, 15:00:26 · Upravil/a: BigBear
Tirus:
Nezkoušel jsem to a vidím to jen zběžně a nevím, jestli správně chápu, co chceš udělat, ale panther ti psal: „dej input před ‚popisek‘“ a to by mohlo pomoct ;-) |
||
| Tirus Profil |
#7 · Zasláno: 28. 4. 2011, 15:38:25
BigBear:
prohodil jsi nicky.. ano, dej input před popisek.. to jsem udělal a stejně mi to nepomohlo.. teď mi dochází, že mi mohl blbnout dreamweaver |
||
| BigBear Profil |
#8 · Zasláno: 28. 4. 2011, 20:43:39 · Upravil/a: BigBear
Tirus:
Jo, promin, uz jsem to opravil :-[ ... jestli to stale jeste nemas, hod mi nekam obrazek toho, jak to ma vypadat a ja se ti to pokusim nastylovat, hm? :-) |
||
| Tirus Profil |
#9 · Zasláno: 29. 4. 2011, 09:47:34
BigBear:
např. 
Jedná se o to, že formulář bude mít šířku třeba 40% a label má být nalevo a input napravo. .. či nějak normálně to napozicovat. |
||
| BigBear Profil |
#10 · Zasláno: 29. 4. 2011, 10:26:04 · Upravil/a: BigBear
Tirus:
Tohle je jedno z řešení (já na to používám tabulky - od toho tu jsou. Je-li potřeba, aby něco mělo tabulkovou strukturu, proč to do ní nedat. Nikoliv celý layout, to je pomalé a zastaralé, ale formulář uvnitř stránky... proč ne ;-) ) <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Formular</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="content-Style-Type" content="text/css" />
<meta http-equiv="Content-Language" content="cz" />
<style type="text/css">
.clear_both { clear: both; height: 0; line-height: 0; font-size: 0; overflow: hidden; }
#wrapper { width: 40%; border: 1px black solid; }
#RoomManager { padding: 10px; }
label { display: block; float: left; }
input { float: right; }
input.text { width: 200px; }
</style>
</head>
<body>
<div id="wrapper">
<form id="RoomManager" name="RoomManager" method="post" action="#">
<label for="doorNumber">Číslo dveří: </label>
<input class="text" type="text" name="doorNumber" id="doorNumber" />
<div class="clear_both"></div>
<label for="keeper">Správce místnosti: </label>
<input class="text" type="text" name="keeper" id="keeper" />
<div class="clear_both"></div>
<label for="area">Pavilon/patro:</label>
<input class="text" type="text" name="area" id="area" />
<div class="clear_both"></div>
<input name="submit" type="submit" value="Zpracovat" />
<div class="clear_both"></div>
</form>
</div>
</body>
</html> |
||
| Tirus Profil |
#11 · Zasláno: 29. 4. 2011, 10:29:51 · Upravil/a: Tirus
BigBear:
v tabulce jsem to také dělal, ovšem chtěl jsem to zkusit jinačím způsobem :) .. Zkoušel jsem to přímo napozicovat ovšem teď už to chápu :) ... za každý label a input dát clear :) |
||
|
Časová prodleva: 13 let
|
|||
0