ボックス内にボックスを入れ子にする WordPress で問題が発生しています。WordPressの外では、これはうまくいきます。1 つまたは 2 つのパラメーターが間違っていると確信しています。
外側のボックスは dp23、内側のボックスは dp22 何らかの理由で、内側のボックス (dp22) の間にスペースがあります。ここで問題を確認できます: http://4tepiano.com/recommended-piano-books-2/
CSS コード:
.dp101
{
float:left;
width:100%;
border:1px solid green;
display: inline;
clear: both;
margin:auto;
}
.dp75 {
width:84%;
border-color:gray;
border-style:solid;
border-width:1px;
overflow:auto;
float: right;
text- align:left;
padding:10px;
}
.dp22 {
border:1px solid red;
HEIGHT: 1.2em;
margin:1px;
padding:1px;
font-size: .8em;
overflow:auto;
display: block;
}
.dp23 {
width:12%;
border:1px solid green;
float:left;
margin:1px;
padding:1px;
}
[edited]
.dp23 p {
display: none;
}
HTML コード:
<div class="dp101" style="BACKGROUND-COLOR: #fdfcdc">
<div class="dp23" style="HEIGHT: 150px";><!--Left Column-->
<!--category--> <div class="dp22"> category </div>
<!--Title--> <div class="dp22" > Title </div>
<!--Author--> <div class="dp22" > Author </div>
<!--Price--> <div class="dp22"> Price </div>
<!--Link--> <div class="dp22"> Amazon Link </div>
<!--Cover--> <div class="dp22" style= "HEIGHT: 85px"; > Cover </div>
</div> <!--End-Left Column-->
<!--Right Column-->
<div class="dp75"style="HEIGHT: 150px"; >
Work in progress.
</div> <!--End-Right Column-->
<div class="dp75" style="HEIGHT: 10px";> <!--Right spacer--> </div>
見やすいように枠線をつけました。ボックスは、境界が互いに接触するように積み重ねる必要があります。