我的div不會左右浮動？

我得到錯誤，因爲我的div，不會浮在所有我的div不會左右浮動？

這裏是我的CSS

#content { 
width: 1070px; 
} 

.date{ 
float:left; 
width:80px; 
margin: 50px 8px 0px -60px; 
padding: 0px 0px 0px 0px; 
} 

.month { 
color:#fff; 
font-size:15px; 
font-family:eurofurence; 
text-transform:uppercase; 
} 

.year { 
color:#fff; 
padding:0 0 7px 0; 
font-size:30px; 
font-family:eurofurence; 
text-transform:uppercase; 
} 
.commentbubble{ 
    background: url('http://bleedartmedia.com/mock/wp-content/themes/KellyRowland/images/commentb.png') no-repeat; 
    width:40px; 
    height:49px; 
    padding:4px 0 0 14px; 
    } 
    .entry { 
    float:right; 
margin: 0px 8px 0px 0px; 
padding: 20px 0px 0px 0px; 
border-bottom: 0px solid #cccccc; 
    font-family:eurofurence; 
    font-size:17px; 
    width:610px; 
    background:#fff; 
}

，這裏是我的設置

  <div id="content"> 
<?php while (have_posts()) : the_post() ?> 

<div class="date"> 
<div class='month'><?php the_date('M');?></div> 
<div class='year'><?php the_time('d');?></div> 
<div class="commentbubble"> 
<?php comments_popup_link(__('0', 'wpbx'), __('1', 'wpbx'), __('%', 'wpbx')) ?> 
</div> 
Comments 
</div> 

    <div class="entry"> 
     <div class="entry-top"> 
      <h2 class="entry-title"><a href="<?php the_permalink() ?>" title="<?php printf(__('Permalink to %s', 'wpbx'), the_title_attribute('echo=0')) ?>" rel="bookmark"><?php the_title() ?></a></h2> 
    </div> 
      <div class="entry-content clearfix"> 

     <div class="entry-content"> 
       <div id="text"><?php the_content() ?></div> 
       </div> 

      </div> 

      <div class="entry-meta"> 
       <span class="entry-meta-sep">|</span> 
       <span class="entry-more"><a href="<?php the_permalink() ?>" title="<?php printf(__('Continue reading %s'), wp_specialchars(get_the_title(), 1)) ?>"><?php _e('Read More &raquo;', 'wpbx') ?></a></span> 
      </div> 
    </div><!-- .post --> 
<?php endwhile; ?> 

     <div class="navigation clearfix"> 
      <div class="nav-previous"><?php next_posts_link(__('Previous <span class="meta-nav">Articles</span>', 'wpbx')) ?></div> 
      <div class="nav-next"><?php previous_posts_link(__('Next <span class="meta-nav">Articles</span>', 'wpbx')) ?></div> 
     </div> 

    </div><!-- #content -->

問題是我想要的「日期」div浮動到「入口」div的左側，但所有的「日期」div做的是坐在頂部的入口div爲什麼？

來源

2012-10-01 Mihad Aiko

您還沒有關閉.date DIV

<div class="date">Date</div>

而對於將來，我會更換

.right{float:right} 
.left{float:left}

然後CSS你可以說<div class="date right"> </div>

清潔CSS：

#content{width:1070px} 
.right{float:right} 
.left{float:left} 
.date{width:80px;margin:50px 8px 0px -60px;padding:0px; } 
.month{color:#fff;font-size:15px;font-family:eurofurence;text-transform:uppercase} 
.year{color:#fff;padding:0 0 7px 0;font-size:30px;font-family:eurofurence;text-transform:uppercase} 
.commentbubble{background:url('http://bleedartmedia.com/mock/wp-content/themes/KellyRowland/images/commentb.png') no-repeat;width:40px;height:49px;padding:4px 0 0 14px} 
.entry{margin:0px 8px 0px 0px;padding:20px 0px 0px 0px;border-bottom:0px solid #ccc;font-family:eurofurence;font-size:17px;width:610px;background:#fff}

而且

padding:0px;

相同

padding:0px 0px 0px 0px;

而且

color:#ffffff; 
color:#cccccc;

相同

color:#fff; 
color:#ccc;

如果你不能看到日期d四，刪除負面margin -60px已設置

來源

2012-10-01 09:50:37 Dipak

@TheBlackBenzKid謝謝！下次我會正確格式化代碼:) – Dipak

沒問題。它更直接針對原始用戶。 – TheBlackBenzKid

最近我開始對'left'和'right'使用不同的css，並將它們作爲第二個類添加到我的元素中。使事情更容易遵循。 +1！ –

嘗試

HTML

<div id="content"> 

     <div class="date">   

     </div> 
     <div class="entry"> 

     </div> 

    </div>

CSS

#content 
{ 
float:left; 
width:1070px; 
} 

.date{ 
float:left; 
width:80px; 
} 

.entry 
{ 
float:right; 
}

來源

2012-10-01 09:51:53

我的div不會左右浮動？

回答

相關問題