css - Anythingslider 导致宽度问题

标签 css anythingslider

在我将 Anythingslider 放入我的网页后,在我尝试调整幻灯片的宽度以匹配页面后,页面最终变成这样 -> http://i.imgur.com/5AlHR.png 我试过弄乱 Anything slider CSS 和我自己的,但我不太确定我能做什么。有什么想法吗?

HTML:

 <div id = "bodyContent-container">
    <div id = "bodyContent">
         <div id = "bands-container">
                <div id = "bands">            
                    <img src="images/slide.jpg" width="960" height="300"/>
                    <img src="images/slide-2.jpg" width="960" height="300" />
                    <img src="images/slide-3.jpg" width="960" height="300"/>
                </div>
         </div>
     </div> 
</div>

CSS:

div#bodyContent-container { 
        width:100%;
        height: 100%;
        min-height:1200px;
        background:#f3f3f3;
        margin: 0 auto;
        padding: 0;
  }
 div#bodyContent {
        width:960px;
        height:100%;
        min-height:1200px;
        margin: 0 auto;
         padding: 0;
        -webkit-box-shadow: 6px 0px 10px -7px #888, -6px 0px 10px -7px #888;
        -moz-box-shadow: 6px 0px 10px -7px #888, -6px 0px 10px -7px #888; /* Firefox 3.6 and earlier */
        box-shadow: 6px 0px 10px -7px #888, -6px 0px 10px -7px #888;
     padding-top: 250px;
   }
   div#bands-container {
         width: 960px;
         height:300px;
         margin: 0 auto;    
         padding: 0;
   }
   div#bands {
         width: 960px;
         height: 300px;
         margin: 0 auto;
         padding-right: 30px;   
   }

网站页面:http://andrewgu12.kodingen.com/graphicDesign 谢谢!

最佳答案

你最喜欢在这里编辑:极简圆形主题

原创:

/******************
  SET STYLING HERE
 ******************
 =================================
 Default state (no keyboard focus)
 ==================================*/
/* Overall Wrapper */
.anythingSlider-minimalist-round {
    margin: 0 auto;
    /* 30px right & left padding for the navigation arrows */
    padding: 0 30px;
}

到:

/******************
  SET STYLING HERE
 ******************
 =================================
 Default state (no keyboard focus)
 ==================================*/
/* Overall Wrapper */
.anythingSlider-minimalist-round {
    margin: 0 auto;
    /* 30px right & left padding for the navigation arrows */
    padding: 0;
}

关于css - Anythingslider 导致宽度问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13374684/

相关文章:

html - 父子元素的css3顺序动画

javascript - 我在 AnythingSlider 中有一个 AnythingSlider,我可以为两个 slider 设置当前幻灯片的样式吗?

python - 在 Django 中链接静态文件目录

css - 如何限制导航栏中 Bootstrap 3 下拉菜单的宽度

jquery - Anythingslider 面板改变另一个对象

jquery - 将页面上的第二个 jquery 任何 slider 链接到不同的 CSS

javascript - AnythingSlider FX 问题

html - <li> 元素不可点击

html - CSS 表格列自动宽度