css - 在 CSS 中对齐相邻对象的问题

Question

我无法让侧栏中的精选文章正确排列(here) .我想让它们看起来更像 this site 上的那些.

这是 CSS:

 #element2 {
    margin:0 auto;
    padding: 5px 0 0px 0px;
    color:#161514;
    font-family:helvetica, sans-serif, Arial;
    font-size: 13px;
    background: #c7c7c7;
    width: 295px;
    height: 60%;
    }
img.element {
    width:305px;
    position:relative;
    right:auto;
    left:auto;
    height:auto;
    overflow:hidden;
    border:1px solid #ccc;
    width:130px;
    height:100px;
    min-height:100px;
    border:0;
    margin:5px 0px 0px 0px;
    display: inline-block;
    }
p.element {
    position:relative;
    align:right;
    width:140px;
    height:100;
    min-height:100px;
    margin:5px 0px 0px 0px;
    font-family: Arial, sans-serif;
    font-size: 12px;
    letter-spacing: 1pt;
    border:0;
    background:#c7c7c7;
    display: inline-block;
    } 

非常感谢任何建议。

谢谢，

度母

PS:我使用的是 Chrome 10

Answer 1

你把css搞得太多了。
删除 p.element 和 img.element css 规则并使用此重新开始样式设置:

img.element {
    height: 100px;
    width: 130px;
   position: absolute;
}
p.element {
    height: 100px;
    margin-left: 130px;
    width: 140px;
}