1

だから私はいくつかの派手なラジオボタンを作ろうとしています、そして私はいくつかの奇妙な効果を得ています。サイズはすべて均一にしたいのですが、スパンが1本か2本かによってサイズが異なります。シングルライナーのボタン名の最後に追加することで修正するために「ハック」することができ<br>&nbsp;ますが、それは特にエレガントではないようです。

この時点で問題はCSSにあるため、JSを削除したことに注意してください。

http://jsfiddle.net/aslum/BMbN2/2/

4

4 に答える 4

1

私は捨ててdisplay: inline-block選ぶでしょうfloat:left

http://jsfiddle.net/BMbN2/7/

ボタンを希望の場所に配置するには、他の値を少し調整する必要がある場合があります。

于 2013-03-25T20:47:52.023 に答える
1

画像は、テキストの最後の行のベースラインに揃えられます。.genreName追加を与えることはそれvertical-align:topを取り除くようです。

于 2013-03-25T20:49:38.527 に答える
1

「vertical-align」cssプロパティをよく理解してください。このような場合に非常に便利です。http://www.w3schools.com/cssref/pr_pos_vertical-align.asp-また、「line-height」は、インラインブロック要素の高さにとって非常に重要です。これを適切に調整していることを確認してください。

「vertical-align:middle;」を追加します。#Action_ Adventure、 #Audiobooks、#Biography _M ​​emoir、#Chick-Lit要素に。また、必ず'.genreName'クラスから高さを削除してください。これにより、物事が少し良くなります。また、ラジオボタンを独自のdivにラップして、正しくフロートさせることをお勧めします。

于 2013-03-25T20:55:01.730 に答える
1

コードの問題は、スパンとラジオボタンの両方がブロックとしてレンダリングされることです。左側のスパンがより多くのスペースを占める場合は、ラジオボタンが押し下げられます。レンダリング方法はブラウザによって異なります。

同じ高さで並べて配置したいようです。そのためには、float:leftとfloat:rightを使用する必要があります。

于 2013-03-25T20:55:52.760 に答える