0

私は自分のウェブサイトのヘッダーを持っています(写真を参照)ヘッダーのボタン

これは基本的<td><a href>にcssでスタイル設定されています。今私の質問は、同じ行に1つ以上のボタンを追加したいが、それらを右に揃えたい場合はどうすればよいですか?

それはcssソリューションである必要はありません、私はhtml<table>または<td>タグでこれを行う方法を探しています。

ありがとう。

編集:これは、ヘッダーを生成するphpの一部です:

echo<<<TOPBARHEREDOC2
<link rel="stylesheet" href="/css/horizontal_navbar.css" type="text/css" media="screen">
<table border="auto"  id="topbar" >        
    <td><a class="topbarlink" href="index.php">Ana Sayfa</a></td>
    <td><a class="topbarlink" href="userstats.php?category=$category">İstatistik</a></td>
    <td><a class="topbarlink" href="contact.php">İletişim</a></td>
    <td><a class="topbarlink" href="useful_links.php">Linkler</a></td>
    <td><a class="topbarlink" href=$lastlink_address>$lastlink_name</a></td>
</table>
<hr>
<br>
TOPBARHEREDOC2;

そしてこれはcssです:

table a.topbarlink{
/*TOP, RIGHT, BOTTOM, & LEFT*/
margin:0px 0px 0px 0px;
font-family: Futura, "Trebuchet MS", Arial, sans-serif;
font-weight:bold;
color:#069;
background-color: #f2f2f2;
text-decoration: none;    
    border-bottom: 2px solid #ccc; 
    border-top: 2px #ccc;
    border-right: 2px solid #ccc;
    border-left: 2px #ccc;
    /*padding (ordered)*/
    padding-top:0.2em;
    padding-right: 1em;
    padding-bottom:0.2em;
    padding-left: 1em;

}
4

2 に答える 2

3

まず第一に、表形式のデータ以外にはテーブルを使用しないでください。セマンティック マークアップは常に優れているため、この場合はメニューに番号なしリストを使用することをお勧めします。

とにかく、これがあなたのテーブルだとしましょう:

<table>
  <tr>
    <th><a href="#">Item 1</a></th>
    <th><a href="#">Item 2</a></th>
    <th><a href="#">Item 3</a></th>
    <th class="right"><a href="#">Item 4</a></th>
  </tr>
</table>

次に、この CSS を使用して、1 つの項目を右に揃えることができます。

table { width: 100%; }
th { float: left; }
th.right { float: right; }​

http://fiddle.jshell.net/6z97w/

于 2012-09-16T12:01:40.923 に答える
1

これはあなたが探しているものですか? http://jsfiddle.net/henrikandersson/aayxV/

于 2012-09-16T12:05:09.373 に答える