Question

如果有人可以查看hindilyricsall.blogspot.com并且可以找出为什么导航栏下方的旋转木马中的下一个箭头没有对齐并且移动到旋转木马下面，我真的很感激？相关代码：

<div id='carousel'>
<div id='previous_button'/>
<div class='container'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default?max-results=&quot;+numposts1+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script>   
</div>
  <div id='next_button'/>
  <div style='clear:both;'/>

</div>

CSS：

#carousel{width:100%;height:240px;position:relative;display:block;}
#carousel .container{position:relative;left:25px;margin-right:25px;width:930px;height:240px;overflow:hidden}
#carousel #previous_button{position:absolute;width:25px;height:240px;background:url(http://3.bp.blogspot.com/-SFH7pfuPOg4/UAVZimY-OuI/AAAAAAAAHqE/MOKZ4nE0EFM/s1600/prev.png) center;z-index:100;cursor:pointer;}
#carousel #next_button{position:absolute;right:0;width:25px;height:240px;background:url(http://4.bp.blogspot.com/-pFR58sZNzCo/UAVZh9I72lI/AAAAAAAAHp8/JTIiHJfsqHA/s1600/next.png) center;z-index:100;cursor:pointer;}
#carousel #next_button:hover,#carousel #previous_button:hover{filter:alpha(opacity=70);opacity:.7}
#carousel ul li:hover{background:#111}
#carousel ul{width:100000px;position:relative;margin-top:10px}
#carousel ul li{background:#272727;display:inline;float:left;text-align:center;font:12px Oswald;line-height:1.3em;width:130px;height:200px;margin:0 1px 6px 9px;padding:8px 5px 6px;border:1px solid #323232;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;}
#carousel ul li a.slider_title{color:#ccc;display:block;margin-top:6px}
#carousel ul li a.slider_title:hover{color:#fec700}

Answer 1

如果将此代码添加到css文件

#carousel .container {
    float:left;
}

箭头将与caroussel对齐

Answer 2

HTML结构存在一些问题，但通过添加float：left to .container可以解决您的问题

箭头即将进入下一行，因为div是块级元素并占用整个空间。

.container {
    float:left;
}

在博客模板模板中对齐问题

2 个答案: