0

私は次のようなdivを持っています

 @namehere   texthereee         today       10 retweet
                                replay       
                                favorite

私はcssを編集して最終的な形を次のように見せようとしています

@namehere   texthereee  testetest              10 retweet
            today   replay   favorite

私の現在のCSSは次のようになります

 .top-tweet, .top-tweet a
 {
font-size: 13px;
text-align: center;
 }
  .col_3 a
 {
font-size: 12px;
 }
 .top-tweet .col_1
 {
width: 60px;
  }
  .top-tweet .col_2
  {
width: 375px;
text-align: left;
  }
  .top-tweet .col_3
  {
width: 100px;
   }
   .top-tweet .col_4
   {
width: 60px;
   }

ここで私が調整しようとしているdivを含むhtml、

         echo "<div class='divrow top-tweet'>";

    echo "<li class='col_1' ><a href='http://www.twitter.com/#!/" . $tweeted_by . "'> <img src='" . $avatar . "' />" . $orig_tweeted_by . " </a></li>";

    echo "<li class='col_2'> <div><a class='text_bigger' href='http://www.twitter.com/#!/" . $tweeted_by . "' style='font-size:13px'>@".$tweeted_by."</a></div>      " . $tweet . "</li>";

    echo "<li class='col_3'> <a href='http://www.twitter.com/#!/" . $tweeted_by . "/status/" . $id . "'>"  . $since . " </a> ";

    echo "<li class='col_3'> <a href='https://twitter.com/intent/tweet?in_reply_to="  . $id . "'> Reply  </a>  ";
    echo "<li class='col_3'> <a href='https://twitter.com/intent/favorite?tweet_id="  . $id . "'> Favorite  </a>  ";


    echo "<li class='col_4'>".$retweet_count."<br>retweet</li>";    
    echo "</div>"; 
}
echo "</div>";

.col_1..3は今日のリプレイお気に入りです

任意のヒント ？

4

2 に答える 2

1

すべてのdivで1つのクラスを試して、すべてのクラスをフロートさせて、必要な幅を設定します

jsfiddle

異なる幅を与えることもできます

<div class="one">skfhsfs</div> 
<div class="one">skfhsfs</div>
<div class="one">skfhsfs</div>
<div class="one">skfhsfs</div>

css

.one{
    width:100px;
    border:1px solid red;
    float:left;
}​
于 2012-10-25T14:40:00.070 に答える
1

使用しようとしているhtmlを投稿する場合に役立ちます。

とにかく、これを試してみてください。

​&lt;div class="main">
    <div class="col_1">@namehere</div>
    <div class="col_2">
        <div>text here.. text here..</div>
        <div>
            <div class="action">today</div>
            <div class="action">replay</div>
            <div class="action">favorite</div>
        </div>
    </div>
    <div class="col_3">10 retweet</div>
</div>

.main {width: 500px}
.col_1, .col_3, .action {width: 100px; float: left}
.col_2 {width: 300px; float: left}
于 2012-10-25T14:46:49.323 に答える