-a potřeboval bych prosím poradit, jak prvkům formuláře INPUTům:) řekněme při šířce stránky pod 360px dát menší šířku, aby nebyly tak roztáhlé a nadpisy Label byly pěkně pod sebou nebo nad INPUTy .
A při šířce stránky nad 360px aby se INPUTy formuláře řadily vedle sebe, nevím už jak na to:( když dám width na 50% , tak zase nadpisy nejsou pod sebou a pri vetsi sirce se nic nezmení na normální formulář:( vse je porad pod sebou a ne vedle sebe. Děkuju Vám
css:
<style>>
.container{ padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
justify-content: center;
height:600px;
}
.content{ text-align: center;
}
@media screen and (max-width:360px){
.container{ padding: 0;
margin: 0;
list-style: none;
display: flex;
align-items: center;
justify-content: center;
height:300px;
}
}
.content{ text-align: center;
}
form label{width: 100%;}
form input{width:100%;
margin-top:5px;
margin-left: auto;}
}
</style>
<html>
<head>
<meta name="viewport content=width=device-width, initial-scale=1.0">
</head>
<body>
<div class="container">
<div class="content">
<form method="POST">
<label><b>Jmeno:</b></label>
<input type="text" id="text" name="jmeno" size="20" placeholder="např. vaše jmeno" />
<label><b>Příjmení:</b></label>
<input type="text" id="text" name="prijmeni" size="20" placeholder="např. vaše příjmení"/>
<label><b>Věk:</b></label>
<input type="text" id="text" name="vek" size="20" placeholder="např. věk"/>
<input type="submit" value="odeslat" name="odeslat">
</form>
</div>
</div>
</body>
</html>