顶部滑块

我的图片出了问题，我无法解决这个问题。这里是我的编码..顶部滑块

HTML

<div id="adsBox"> 
    <div id="ads"> <a href="#"> <img src="picture.jpg" alt="ads"> </a> </div> 
    <p> <a href="#" id="showLink" class="showAds">HIDE</a> </p> 
</div>

CSS

#ads { 
    -webkit-border-bottom-right-radius: 6px; 
    -webkit-border-bottom-left-radius: 6px; 
    -moz-border-radius-bottomright: 6px; 
    -moz-border-radius-bottomleft: 6px; 
    border-bottom-right-radius: 6px; 
    border-bottom-left-radius: 6px; 
} 

#adsBox { 
    text-align:right; 
    color:black; 
    width:970px; 
    margin:0 auto; 
    background-color:#E0E0E0; 
    -webkit-border-bottom-right-radius: 6px; 
    -webkit-border-bottom-left-radius: 6px; 
    -moz-border-radius-bottomright: 6px; 
    -moz-border-radius-bottomleft: 6px; 
    border-bottom-right-radius: 6px; 
    border-bottom-left-radius: 6px; 
} 

#adsBox a { 
    color:#535353; 
    padding:0; 
    margin:0; 
} 

#adsBox a:hover { 
    color:#4682b4; 
} 

#ads a { 
    margin:10px; 
} 

#showLink { 
    text-decoration:none; 
} 

.hideLink { 
    display:none; 
}

我使用jQuery滑下。一切都好，只是问题是形象不是真的在div上。这有点向右移动。这里是JSFIDDLE。有任何想法吗？

来源

2014-03-12 Anthosiast

你可以添加你的jquery到提琴手吗？ – BlackHatSamurai

你可以添加一个有效的图像，你的脚本到小提琴？ –

我试图删除'text-align：right'，但它仍然是一样的。 @Justin – Anthosiast

T他错误在这里。

#ads a { 
    margin:10px; 
}

div内部的图像会因左边距为10像素而右移一点。它必须删除。

来源

2014-03-12 19:24:52 Anthosiast

您已设置像素宽度，为width:970px;

改变它

width:100%;

FIDDLE

侧面说明：您可能要关闭img标签，希望这修复您的问题

来源

2014-03-12 19:22:44

这对我来说很有意义。无论如何，我已经解决了这个问题，我已经在那里回答了。感谢回复！ – Anthosiast

@Anthosiast好吧，如果你设置的像素宽度，它会在你的屏幕上看起来很好，但它会在小分辨率的设备或jsfiddle中创建水平滚动。因为你在小提琴中的形象被打破了，这是唯一可见的东西。 –

是的，它会对响应非常有用。谢谢你让我知道。 – Anthosiast

回答

相关问题