2 行のボタンがあり、1 つを左揃えに、もう 1 つを右揃えにしたいのですが、別の行に配置します。
テーブルを使用していた場合、これは私が行う方法です:
<table>
<tr>
<td>Content Left Aligned</td>
</tr>
<tr>
<td align="right">Content Right Aligned</td>
</tr>
</table>
しかし、ここでは CSS と div を使用しようとしています。これは私が持っているものです: ( JSFiddle )
<div style='text-align:left;'>
<div class="btn1 rounded-corners">
Green
</div>
<div class="btn1 rounded-corners">
Blue
</div>
<div class="btn1 rounded-corners">
Purple
</div>
</div>
<div style="clear:all;"> </div>
<div style='text-align:right;'>
<div class="btn2 rounded-corners">
Six
</div>
<div class="btn2 rounded-corners">
Seven
</div>
<div class="btn2 rounded-corners">
Eight
</div>
</div>
<div style="clear:all;"> </div>
この CSS のどこが間違っているのでしょうか? (何が起こっているかの実例については、JSFiddleを参照してください。ここで散らかしたくないスタイルがいくつかあります)