本日やっと届きました(・∀・)
ミナサンダイスキガンダムデス(｀・ω・´)
結婚式のカタログギフトって色々種類があるんですね。
秋葉原にエアブラシと作業場所を貸してくれるお店があるらしいので
是非一度行って本格的に塗装してみたいですね。
さて、今回もHTMLネタです。
今日は1行内に左揃え、右揃えを両立方法です。
本来text-alignでのテキスト配置の指定は1行に対して反映されるので
できないように感じてしまいますが、divタグとfloatプロパティを使う事で
実現することが可能です。
実際のソースはこんな感じです。
■HTML
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="Shift_JIS"/>
<link rel="stylesheet" href="css/sample.css" type="text/css">
</head>
<body>
<table>
<tr>
<td class="row">
<div class="left">
ひだり
</div>
<div class="right">
みぎ
</div>
</td>
</tr>
</table>
</body>
</html>
■css
.left{
text-align:left;
float: left;
background-color:#FF0000;
}
.right{
text-align:right;
background-color:#00FF00;
}
.row{
width:150px;
background-color:#0000FF;
}
少し解説すると、leftが適用されている「ひだり」の要素に
左寄せ、左回りを適用し、rightが適用されている「みぎ」の要素を
右寄せにしています。
簡単に実現できましたね。
次回以降もHTMLのネタが続くかもしれません。
今回はこの辺りで(・∀・)ﾉｼ