对齐2列文本链接

我在我的代码块中有这样的代码，我希望左右两列。现在的第二个是在第一列。对齐2列文本链接

<style type="text/css"> 
    a img{border:none;} 
    #planninglaunchbox 
    { 
     background:#f3f8e7; 
     color:#1f1f1f; 
     font:normal 11px Arial,sans-serif; 
     margin:0 10px 10px 0; 
     overflow:hidden; 
     width:235px; 
    } 
     #planninglaunchbox .inner 
     { 
      padding:10px 0 10px 10px; 
     } 
     #planninglaunchbox a{color:#1f1f1f;text-decoration:none;} 
     #planninglaunchbox a:active, 
     #planninglaunchbox a:hover{text-decoration:underline;color:#579BC3;} 
     #planninglaunchbox h3 
     { 
      color:#1f1f1f; 
      font:normal 12px Georgia,serif; 
      margin:0 0 5px; 
      text-transform:lowercase; 
      width:215px; 
     } 
     #planninglaunchbox h4 
     { 
      font:bold 12px Arial,sans-serif; 
      margin:0 0 10px; 
     } 
     #planninglaunchbox ul 
     { 
      list-style:none; 
      margin:0 0 5px; 
      padding:0; 
     } 
      #planninglaunchbox ul.first{margin-right:10px;} 
      #planninglaunchbox ul.first, 
      #planninglaunchbox ul.last 

     { 
       float:left; 
      } 

      #planninglaunchbox ul li 
      { 
       background:none; 
       margin-bottom:5px; 
       padding:0; 
      } 
       #planninglaunchbox ul li img 
       { 
        margin-right:6px; 
        vertical-align:middle; 
       } 
     #planninglaunchbox .seeall 
     { 
      clear:both; 
      margin:0; 
      padding:0; 
      width:auto; 
     } 
</style> 
<div id="planninglaunchbox"> 
<div class="inner"> 
<h3> Theme</h3> 
<ul class="first"> 

!--Some links-- 

</ul> 




<ul class="last"> 

!--Some links-- 


</ul> 

</div> 
</div>

来源

2010-04-23 andu

欢迎SO，安渡！这里的帖子被允许包含一些HTML，并根据你的帖子对我的看法，我怀疑你的一些HTML标签没有按照你的意图显示。在发布我们的格式规则摘要时，您可以点击大橙色问号块。你会重新格式化吗？这会让我们更容易理解您的问题并为您提供帮助。 – Pops 2010-04-23 17:01:28

将float:left用于要并排放置的元素。

来源

2010-04-23 17:02:59 Sarfraz

我喜欢名单。它们也具有语义意义。

<style> 
ul { 
    width:200px; 
} 

ul li { 
    width:100px; 
    float:left; 
} 
</style> 

<ul> 
    <li><a href="">Something</a></li> 
    <li><a href="">Something</a></li> 
    <li><a href="">Something</a></li> 
    <li><a href="">Something</a></li> 
</ul>

随着一些间距：

<style> 
    ul { 
     width:220px; 
    } 

    ul li { 
     width:100px; 
     float:left; 
     margin-left:10px 
    } 
    </style>

来源

2010-04-23 17:52:48

:) 我工作正常后，我添加“宽度：100px;” 我可以增加两列之间的距离吗？干杯。 – andu 2010-04-23 18:33:11

对齐2列文本链接

回答

相关问题