0

それで、私は自分のサイトに「リンク」divを作成することに取り組んでいます。（参照はこちら）リンクはすべて画像ですが、何らかの理由でそれらが含まれているdivが不必要に長いです。画像は現在の約 3 倍の長さになっているはずですが、div のサイズを変更して大きくすると、ビデオと重なって押し下げられます。

コードは次のようになります。

<div class="links">
    <ul>
        <li><a href="http://music.papkeeproductions.com"><img src="Images/button_home.png" width="52%" height="69" style="width:15%;height:auto;" /></a></li>
        <li><a href="http://papkee.bandcamp.com"><img src="Images/button_music.png" style="width:15%;height:auto;" /></a></li>
        <li><a href="http://papkeeproductions.com"><img src="Images/button_films.png" style="width:15%;height:auto;" /></a></li>
    </ul>
</div>
<div class="player">
    <iframe src="http://www.youtube.com/embed/MTmUnOHs5Xs"></iframe>
</div>

そしてcss

.links {
float:left;
width:100%;
margin-left:0;
height:auto;
}
.links ul {
list-style-type:none;
margin:0;
padding:0;
}
.links img {
width:180px;
height:auto;
}
.player {
float:right;
padding:8px;
border-style:solid;
border-radius:31px 31px;
border-color:rgb(45,25,11);
border-width:2px;
margin-right:0;
width:45%;
height:45%;
}
.player iframe {
width:100%;
height:100%;
border:none;
}

それでどうしたの？それは私のジミーを一日中ざわめかせていて、私は問題を見つけることができないようです.

ありがとう！

4

2 に答える 2

0

.links の幅が 100% になっているのはなぜですか。これを 30% に変更すると、動画が押し下げられなくなります。変更の例を次に示しますhttp://codepen.io/hwatkins/pen/qmzEB

于 2013-02-28T22:24:20.020 に答える
0

タグ内にあるスタイル属性がスタイルシートをオーバーライドしています:

style="width:15%;height:auto;"

以下よりも優先されます。

.links img {
    width:180px;
    height:auto;
}
于 2013-02-28T22:25:45.330 に答える