0

Dreamweaver で jquery タブを使用しているときに、タブの幅に問題があります。

4 つのタブをコンテンツ ボックスの全幅に広げたいので、合計 100%、タブごとに 25% ですよね? 唯一の問題は、25% を選択すると、4 番目のタブが 1 行下に移動することです。タブが下に移動する前に使用できる最大 % 幅は 24.7% ですが、これにより、コンテンツ ボックスの最後に小さなハプが残ります。

これは、私が説明していないパディングがどこかにあることを示唆していますが、見つけられないようです。

誰にもアイデアはありますか?

ありがとう

更新: タブのコード

.ui-tabs{
position: relative;
padding-top: 0em;
padding-right: 0em;
padding-left: 0em;
padding-bottom: 0em;
zoom: 1;
border-radius: 10px;
margin-top: 40px;
/* [disabled]width: 100%; */
}.ui-tabs .ui-tabs-nav{
margin: 0;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
position: absolute;
top: -32px;
left: -1px;
width: 100%;
}.ui-tabs .ui-tabs-nav li{
list-style: none;
float: left;
position: relative;
top: 0;
margin-top: 1px;
margin-left: 0;
margin-bottom: 0;
border-bottom: 0;
white-space: nowrap;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
width: 25%;
}.ui-tabs .ui-tabs-nav li a{
float: left;
padding-top: .5em;
padding-right: 1em;
padding-left: 1em;
padding-bottom: .5em;
text-decoration: none;
}.ui-tabs .ui-tabs-nav li.ui-tabs-active{
margin-bottom: -1px;
padding-bottom: 1px;
}.ui-tabs .ui-tabs-nav li.ui-tabs-active a,.ui-tabs .ui-tabs-nav li.ui-state-disabled a,.ui-tabs .ui-tabs-nav li.ui-tabs-loading a{
cursor: text;
}.ui-tabs .ui-tabs-nav li a,.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active a{
cursor: pointer;
width: 0%;
}.ui-tabs .ui-tabs-panel{
display: block;
border-width: 0;
padding-top: 1em;
padding-right: 1.4em;
padding-left: 1.4em;
padding-bottom: 1em;
}
4

0 に答える 0