0

我一直在尝试将标题内的滑块居中。标题和整个容器整齐地居中，只有 margin: 0 auto; 然后我尝试在标题中包含幻灯片，并尝试通过多种方式正确放置它。是的，我通过使用 position:abslute 然后使用坐标来成功实现自己的配置，但这不适用于世界其他地方。

该网站（正在建设中）是 www.hrcprojectconsulting.com

既然你能看到所有的 CSS 东西，你知道天上可以怎么定位吗？我尝试了所有的保证金组合，但我没有我能想到的选项。

一个好消息是 Internet Explorer 10 现在也可用于 Windows 7，所以 CSS3 的东西和 html5 占位符可以工作，所以我再也不会为向后的东西编码了。

注意：如果您碰巧看到一切正常，这是因为您的显示器和分辨率与我相同。

谢谢你

滑块的代码：

 <style type="text/css" media="screen">
#slider {
    width: 960px; /* important to be same as image width */
    height: 150px; /* important to be same as image height */
    position: relative; /* important */
    overflow: hidden; /* important */
}
#sliderContent {
    width: 960px; /* important to be same as image width or wider */
    position: absolute;
    top: 125px;
    left:265px;

    margin-left: 0;
}
.sliderImage {
    float: left;
    position: relative;
    display: none;
}
.sliderImage span {
    position: absolute;
    font: 10px/15px Arial, Helvetica, sans-serif;
    padding: 10px 13px;
    width: 384px;
    background-color: #000;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    opacity: 0.7;
    color: #fff;
    display: none;
}

我主页的代码：

<style type = "text/css">
::selection{ background-color: #E13300; color: white; }
::-moz-selection {background-color: #E13300; color: white; }
::webkit-selection{ background-color: #E13300; color: white; }



body{

    background:url('../assets/uploads/miweb/gradient2.png');
    background-repeat:repeat-x;
    font: 13px/20px normal Helvetica, Arial, sans-serif;
    color: #4F5155;
    margin:0;
    padding:0;
    line-height: 1.5em;

}

b{font-size: 110%;}
em{color: red;}

#maincontainer{
width: 960px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
}

#topsection{
background: url("../jq185/css/start/images/ui-bg_gloss-wave_75_2191c0_500x100.png") repeat-x scroll 50% 50% #2191C0;
height: 300px; /*Height of top section*/
}
4

1 回答 1

1

这是因为ul具有默认填充。您必须将填充设置为ul#sliderContent0：

 #sliderContent {
    padding:0;
    margin:0;
 }

然后你应该position: absolute从你的样式表中删除。

要将其sliderContent放在底部，您可以这样做：

 #topsection {
    position: relative;
 }
 #slider {
    position: absolute;
    bottom: 0;
 }
 #sliderContent {
    padding: 0;
    margin: 0;
 }
于 2012-11-28T12:39:18.633 回答