0

投稿を連続した行に表示しようとしていますが、コンテナーの境界をオーバーフローし続けています。親の幅を最小に設定しようとしましたが、それでもオーバーフローします。ここに私のブログサイトへのリンクがあります

www.darealistmedia.com

そこで私の問題を見ることができます。そして、ここに私のCSSファイルがあります。「メイン」は、それらを保持しようとしているコンテナーです。

* {
    margin:0px;
    padding:0px;
}
h1 {
    font:bold 20px Tahoma;
}
h2 {
    font:bold 14px Tahoma;
}
header, section, footer, aside, nav, article, hgroup {
    display:block;
}
body {
    width:100%;
    display:-webkit-box;
    -webkit-box-pack:center;
}
.holder {
    max-width:1000px;
    margin:15px 0;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-box-flex:1;
}
header {
    background:yellow;
    border:3px solid black;
    padding:auto;
    /*20*/
}
.navigation {
    border:3px solid black;
    background:blue;
    color:white;
    padding:10px;
    text-align:center;
}
.navigation div {
    display:inline-block;
}
.new_div {
    display:-webkit-box;
    -webkit-box-orient:horizontal;
}
.main {
    text-align:center;
    border:4px solid orange;
    -webkit-box-flex:1;
    margin:20px;
    padding:20px;
}
.right-sidebar {
    border:1px solid red;
    width:220px;
    margin:20px;
    margin: background:#66cccc;
}
footer {
    text-align:center;
    padding:20px;
    border-top:2px solic green;
}
/*Post Styles*/
.postSection {
    display:-webkit-box;
    -webkit-box-orient:horizontal;
    width:800px;
    overflow:scroll;
}
.postWrapper {
    border:2px solid red;
    padding:5px;
    margin:11px;
    width:270px;
    height:270px;
}
.postTitle {
    background-color:#303030;
    font-size:28px;
    font-weight:bold;
    font-family:Trajan Pro;
    color:white;
    padding:5px;
}
.postContent {
    background:#c7c7c7;
}
.postTabs {
    text-align:center;
    background-color:#202020;
    float:left;
    color:white;
    padding:5px;
}
.day {
    font-size:30px;
}
.linkList {
    float:right;
}

私は何を間違っていますか?

4

1 に答える 1

0

これは想定どおりに動作します。postWrapper に 270px の高さを指定しましたが、コンテンツがそれより大きくても、高さは 270px です。を使用overflow: hidden;して余分なコンテンツを非表示にすることもできますが、これでは文の途中でコンテンツが途切れてしまいます。おそらく次のものに置き換える方が良いでしょheight: 270px;min-height: 270px;:

.postWrapper {
    border:2px solid red;
    padding:5px;
    margin:11px;
    width:270px;
    min-height:270px;
}
于 2013-05-05T08:46:07.217 に答える