4

私はここでちょっと困っています。<li>同じ .xml に 6 つの要素セットがあり<ul>ます。ここにデモがあります。私の目標は、要素がページの右側からはみ出すようにすることです。後で JavaScript を使用して要素を循環させます。どういうわけか、私が何をしようとしても、他の要素を押し下げるだけです. 私が試してみました：

float:left;

display:inline-block;

実際にディスプレイのすべてのフレーバーを試しclear:both;てみましたが、リストをdivに設定し、幅をばかげたピクセル幅に設定して、それが端から適切に押し出されることを望んでいましたが、何もしませんでした。

何か案は？

JavaScript ソリューションを回避したいのですが、すべて大歓迎です。

注: 最終的に、これらは 20% を超える幅になり、それぞれ<li>が画面の幅にまたがり、jquery がそう言うと移動します。

4

2 に答える 2

5

li の幅を 20% ではなく固定幅にする必要があります。パーセンテージで指定する場合は、コンテナーの大きさに関係なく、li は常にその幅の 20% になります。

また、li コンテナーの幅が、li を格納するのに十分な大きさであることを確認してください。

このようなもの

http://jsbin.com/eyemaf/1/edit このリンクが機能することを願っています私は通常jsbinを使用しません

.bodynavs{
    width:200px;
    min-height:100px;
    border:1px solid green;
}

#slideimages{
    list-style-type:none;
    padding:0;
    margin:0;
    overflow:hidden;
    width: 2000%;
}
于 2013-04-19T19:02:15.017 に答える
4

white-spaceCSS プロパティを変更してみてください。

white-space: nowrap;

これにより、リスト要素がすべて 1 行に表示され、意図したとおりに画面からはみ出し、必要に応じてスクロールできるようになります。

于 2013-04-19T19:04:28.777 に答える