This question has actually came from my experiments with GWT framework but I decided to simplify the question.
I'm trying to replace table tag with divs. How can I horizontally align two DIV tags that contain two vertically aligned DIV tags ?
Here is what I have:
<!doctype html>
<html>
<body>
<div style="display: block; ">
<div style="display: inline; ">
<div class="gwt-Label" >Name:</div>
<div class="gwt-Label" >Address:</div>
</div>
<div style="display: inline; ">
<div class="gwt-Label" >test1</div>
<div class="gwt-Label" >test2</div>
</div>
</div>
</body>
</html>
It's rendered in my Chrome 15.0.874.106 m as:
Name:
Address:
test1
test2
where I expected it to be:
Name: test1
Address: test2
Could you please help me ?
I think for the example you have an actual table would be more appropriate, however; you could also do something like this:
<body>
<div style="display: table;">
<div style="display: table-row;">
<div style="display: table-cell;">Name:</div>
<div style="display: table-cell;">test1</div>
</div>
<div style="display: table-row;">
<div style="display: table-cell;">Address:</div>
<div style="display: table-cell;">test2</div>
</div>
</div>
</body>