小编Jer*_*Ahn的帖子

http://jsfiddle.net/48Y37/

我想在图像顶部的两个角上都有圆角.技术上它在那里,但被图像覆盖.我看过整个网络,我看到人们谈论overflow: hidden;甚至JavaScript(我想尽可能避免)但我似乎永远无法将其实现到我现有的代码片段上.

提前致谢.

<section class="container">
    <header>
        <img src="http://i.imgur.com/CpL8u.png" style="box-shadow: 0px 0px 10px #888;" />
    </header>
    <section class="body">
        Lorem ipsum blahblah I don't know the rest.
    </section>
</section>

CSS:

header {
    width: 640px;
    margin-left: -10px;
    margin-top: -10px;
}
section.container {
    background: #fff;
    width: 620px;
    margin: auto;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 10px;
    box-shadow: 0px 0px 20px #888;
}
section.body {
    margin-top:10px;
}

CSS:

.share {
    width: 150px;
    height: 20px;
    background: #000;
    float: right;
    white-space: nowrap;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 3px;
    background-color:rgba(255, 255, 255, 0.5);
    border-bottom-left-radius: 5px;
    box-shadow: 0px 0px 10px #888;
    vertical-align: top;
}

HTML:

<div class="share">
    <div class="fb-like" data-href="http://bronies.info/" data-send="false" data-layout="button_count" data-width="450" data-show-faces="true" style="width:47px; overflow:hidden; top:-3px; left:3px;"></div>
    <a href="https://twitter.com/share" class="twitter-share-button" data-text="Wondered what the bronies were all about?" data-count="none">Tweet</a>
    <div class="g-plusone" data-size="medium" data-annotation="inline" data-width="300" style="width:32px; overflow:hidden;"></div>
</div>

Chrome,Safari:

Internet Explorer,Firefox和Opera:

如果你能看到我在HTML style属性中做了什么,我就用过了top:-3px,之前我在其他浏览器上测试我的网站之前做了这个(Chrome是我的主要网页浏览器).我top之所以使用,是因为快速的Google搜索引导我一个页面指示我这样做.既然这个解决方案不起作用,我将如何调整它以对齐并在所有Web浏览器上工作？

每个数组字符串表示文件夹中的文本文件.我希望根据文本文件包含的内容对数组进行排序.我该怎么办？