Hi guys,
I have two <div>'s vertically aligned. I want a third div to seperate them by a small gap. SO we have
<div class="1"></div>
<div class="gap"></div>
<div class="2"></div>
But when I set the height of the gap div, it doesn't seem to work. It always seems to set to a minumum of one character?? With a height of zero it is atill one char. With a height of -1, the height goes to zero!! AARGH!!! How do I do this?if you've want a gap, use margins:
<div style="width:300px;float:left;margin-right:10px;">
....text here....
</div>
<div style="width:300px;float:right;margin-left:20px;">
....more text here....
</div>
The left and right margins add up to 20px. You can make it as much as you want, and you could just put the margin in one div. Unlike with tables, there's no need for empty elements. Infact, empty elements incress source size and are unsemantic.No, I mean a vertical gap. And I can't use margins, because all three div's use different backgrounds, so the gap must be a different div. I think??Why not just set the body to have that background, and use margins? And if you need a vertical gap, than use margin-top and margin-bottom .I will try it and see what happens
also, instead of using margin-top: 10px; and margin-right: 10px; etc... just use one margin: __px __px __px __px;
the order that it is read is top right bottom left. if u have just two numbers the first will be for top and bottom and the second for left and right. and if u have 3 numbers 1st is for right 2nd top and bottom and 3rd for left. also if u have just 1 it applies to all this will just help cut the code down a tad if u do go with this I prefer to use that, but some older browsers have issues reading it. Plus, when simply defining two, I'd say it's a toss up. For 3 or more, I go with that anyway. Guess I'm indecisive.
I have two <div>'s vertically aligned. I want a third div to seperate them by a small gap. SO we have
<div class="1"></div>
<div class="gap"></div>
<div class="2"></div>
But when I set the height of the gap div, it doesn't seem to work. It always seems to set to a minumum of one character?? With a height of zero it is atill one char. With a height of -1, the height goes to zero!! AARGH!!! How do I do this?if you've want a gap, use margins:
<div style="width:300px;float:left;margin-right:10px;">
....text here....
</div>
<div style="width:300px;float:right;margin-left:20px;">
....more text here....
</div>
The left and right margins add up to 20px. You can make it as much as you want, and you could just put the margin in one div. Unlike with tables, there's no need for empty elements. Infact, empty elements incress source size and are unsemantic.No, I mean a vertical gap. And I can't use margins, because all three div's use different backgrounds, so the gap must be a different div. I think??Why not just set the body to have that background, and use margins? And if you need a vertical gap, than use margin-top and margin-bottom .I will try it and see what happens
also, instead of using margin-top: 10px; and margin-right: 10px; etc... just use one margin: __px __px __px __px;the order that it is read is top right bottom left. if u have just two numbers the first will be for top and bottom and the second for left and right. and if u have 3 numbers 1st is for right 2nd top and bottom and 3rd for left. also if u have just 1 it applies to all
this will just help cut the code down a tad if u do go with this I prefer to use that, but some older browsers have issues reading it. Plus, when simply defining two, I'd say it's a toss up. For 3 or more, I go with that anyway. Guess I'm indecisive.