Html 我的边栏在底部浮动

在我为youtube视频制作的自定义模板文件中，我的侧边栏出现了问题，它在底部显示了侧边栏，下面是我正在使用的代码

谁能帮帮我，它应该贴在右边，因为

<?php
/**

 Template Name: gallery

*/


get_header(); 
?>
<style>
/* some basic styling */

h1 {font-size:20px; line-height:95%;}

#galvidcontainer {
  width:1100px;
  margin-left:50px;
  height:1250px;
}

.galvidpre {
  width:300px;
  height:300px;
  float:left;
  margin:5px;
  background-color:#00A0DA;
}

.galvidprevid {
  width:300px;
}

.galvidpretext {
  width:280px;
  padding-top:2px;
  margin-top:2px;
}

</style>

<div id="galvidcontainer">
<h1>Videos</h1>

     <?php /* Loop the stuff from the videos post type */
          $args = array( 'post_type' => 'videos', 'posts_per_page' => 10 );
          $loop = new WP_Query( $args );
          while ( $loop->have_posts() ) : $loop->the_post();?>
          <div class="galvidpre">
               <div class="galvidprevid">
               <?php
               /* Set variables and create if stament */
                $videosite = get_post_meta($post->ID, 'Video Site', single);
                $videoid = get_post_meta($post->ID, "Video ID", single);
                if ($videosite == vimeo) {  
                echo '<iframe src="http://player.vimeo.com/video/'.$videoid.'" width="300" height="190" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>';
                } else if ($videosite == youtube) {
                echo '<iframe width="300" height="190" src="http://www.youtube.com/embed/'.$videoid.'" frameborder="0" allowfullscreen></iframe>';
                } else {
                echo 'Please Select Video Site Via the CMS';
                }
                ?>
               </div>
               <div class="galvidpretext">
                    <h1><?php the_title() ?></h1>
                    <p>
                    <?php /* this is just a limit on characters displayed */
                    $words = explode(" ",strip_tags(get_the_content()));
                    $content = implode(" ",array_splice($words,0,20));
                    echo $content; ?>
                    </p>
               </div>

</div>

     <?php endwhile;?>

</div>
<?php get_sidebar() ?> 
<?php get_footer() ?>

/*一些基本的造型*/
h1{字体大小：20px；行高：95%；}
#玻璃容器{
宽度：1100px；
左边距：50像素；
高度：1250px；
}
galvidpre先生{
宽度：300px；
高度：300px；
浮动：左；
保证金：5px；
背景色：#00A0DA；
}
贾维德普雷维德先生{
宽度：300px；
}
Galvid先生的借口{
宽度：280px；
垫顶：2件；
边缘顶部：2倍；
}
视频

---

侧边栏发生的事情看起来你必须清除浮动。使用或清除：两者都有

<div id="container" class="clearfix"></div>


.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

.clearfix:之后{
内容：“.”；
显示：块；
明确：两者皆有；
可见性：隐藏；
线高：0；
身高：0；
}
.clearfix{
显示：内联块；
}
html[xmlns].clearfix{
显示：块；
}
*html.clearfix{
身高：1%；
}

添加

边框：1px实心#f00到您的容器并查看发生了什么。最有可能的是，它们无法放在页面上。请尝试减少侧边栏的宽度，或者向我们展示一个实例，我们可以在其中查看您所说的更改，>>Jashwant i也减少了主容器的宽度和侧边栏的可用空间，但不会出现。这里是侧边栏的CSS？避免仅链接的答案。一旦链接断开，这些答案将无效。在这里包括相关的代码片段，并使用链接作为参考。嗨，克里斯，你能实现它并告诉我代码吗？我做到了，但失败了。我给了“galvidcontainer”claerfix类并将clearfix css添加到你的css文件中