Menu
If you were looking to put some space around both those divs as a whole then add padding to the main wrapper as a margin on the second div will collapse onto the wrapper and move the wrapper not the second div. <div style="width:800px; margin:0 auto;[B]padding:20px 0;[/B]"> <div><label etc..
When you set a particular height and width for a div, it does not matter if it is empty or overflowed, it will only take up the space as given in the code.
In case you want additional space ( more than the default ) between div rows then you can add the following code before/after the start of the div row depending on where you want the additional space. This is easier but will add a fixed amount of gap.
Creating extra spaces before or after text To create extra spaces before, after, or in-between your text, use the (non-breaking space) extended HTML character. For example, with the phrasing "extra space" using a double space, we have the following code in our HTML.
it works if you remove floating. http://jsbin.com/izoca/2/edit
with floats it only works if theres some content e.g.
Try adding to the empty items.
I don't understand why you're not using a <table> here, though? They will do this kind of stuff automatically.
Slight update to @no1cobla answer. This hides the period. This solution works in IE8+.
.class:after
{
content: '.';
visibility: hidden;
}
Simply add a zero width space character inside a pseudo element
.class:after {
content: '\200b';
}
A simple solution for empty floated divs is to add:
this way you can keep the float functionality and force it to fill space when empty.
I use this technique in page layout columns, to keep every column in its position even if the other columns are empty.
Example:
.left-column
{
width: 200px;
min-height: 1px;
float: left;
}
.right-column
{
width: 500px;
min-height: 1px;
float: left;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With