On a small device I’d like my labels above my textboxes:
On a larger device I’d like my labels to be on the left of my input boxes:
Here’s how:
<html>
<head>
<style>
@media (max-width: 400px) {
#content {
margin: 50px;
}
#labelContainer {
width: 0px;
}
#content label {
display:inline-block;
}
}
@media (max-width: 5000px) {
#content {
margin: 50px;
}
#content label {
display:inline-block;
}
}
</style>
<body>
<div id="content">
<div id="labelContainer">
<label>First name:
<input type="text" />
</label>
</div>
<div id="labelContainer">
<label>
Last name:
<input type="text" />
</label>
</div>
</div>
</body>
</html>
No comments:
Post a Comment