2
I need to position controls Abels, exactly one below the other and sometimes beside. I do this with table, but ask. Is there another way to do this and give a result similar to table? Table is manual, and everything mine is dynamic.
2 answers
2
Why run away from the Tables? They are there to be used (just don’t use them to position layout, please). Anyway, of course there is.
Consider the following HTML:
<form action="">
<fieldset>
<legend>Nosso form</legend>
<label><span>Nome:</span>
<input type="text" size="25" /></label>
<label><span>Idade:</span>
<input type="text" size="25" /></label>
<label><span>Besteiras:</span>
<textarea rows="10" cols="23"></textarea></label>
<label><span>Nome de novo:</span>
<input type="text" size="25" /></label>
<div><input type="submit" class="submit"
name="submit" value="Enviar" /></div>
</fieldset>
</form>
We have here our first example:
fieldset span { float: left; width: 6em; text-align: right; }
label { display: block; margin: 0; padding: 0;}
input, textarea { text-align: left; }
input.submit { text-align: center; }
Second example, only more elegant:
fieldset span { float: left; width: 6em; text-align: right; }
label { display: block; margin: 0; padding: 0;}
input, textarea { text-align: left; }
input.submit { text-align: center; }
body { font-size: 80%; }
label, input.submit, legend, fieldset { font: normal 1em
Verdana, Geneva, Arial, Helvetica, sans-serif; }
legend { padding: 1em; }
label { margin: 0.5em; }
fieldset { padding: 1em; }
fieldset div { margin: 0.5em; padding-left: 6.5em; }
fieldset span { padding-right: 0.5em; }
-
1
Good examples. But the answer would only deserve a +1 (on my part) if the details were explained. :)
Browser other questions tagged html css
You are not signed in. Login or sign up in order to post.
Tables are to display data in tabular format. For layout, the recommended is to use CSS. This doesn’t need to be ironed and set on fire, of course, but in general everything that can be done with table can also be done with CSS, you just need to take a little time to learn. And if your content is dynamic on top of that, the benefit of using CSS is even greater: because you don’t need to mess with the code that generates Markup when you just want to change the presentation/appearance.
– mgibsonbr