0

タブは完全に機能します。IE での配置に問題があります。Mozilla では、タブの配置が完全に表示されますが、IE でページをロードすると、タブがテーブルの完全な左側に移動します。

ここに私のCSSコードがあります:

 a:active {
outline: none;
 }
 a:focus {
-moz-outline-style: none;
 }
 #tabs_container {
width: 626px;
font-family: Arial;
font-size: 10px;
}
 #tabs_container ul.tabs {
list-style: none;
border-bottom: none;
height: 25px; 
margin: 0px;

  }
  #tabs_container ul.tabs li {
 float: left;
   }
  #tabs_container ul.tabs li a {
padding: 6px 9px;
display: block;
border-left: 1px solid #90afcb;
border-top: 1px solid #90afcb;
border-right: 1px solid #90afcb;
border-bottom: 1px solid #90afcb;
margin-right: 4px;
text-decoration: none;
background-color: #ffffff;
    }
    #tabs_container ul.tabs li.active a {
background-color: #90afcb;
padding-top: 6px;
    }
   div.tab_contents_container {
border: none;
border-top: none;
padding: 10px;
font-size: 10px;
    }
    div.tab_contents {
display: none;
    }
    div.tab_contents_active {
display: block;
    }
    div.clear {
clear: both;
    }

HTML

  <!-- These are the tabs -->
  <ul class="tabs">
    <li class="active">
      <a href="#" rel="#tab_1_contents" class="tab"><span>Dienstleistung | Services</span></a>
    </li>
    <li><a href="#" rel="#tab_2_contents" class="tab"><span>Über uns | About us</span></a></li>
    <li><a href="#" rel="#tab_3_contents" class="tab"><span>Netzwerken | Networking</span></a></li>
    <li><a href="#" rel="#tab_4_contents" class="tab"><span>Social Media</span></a></li>
    <li><a href="#" rel="#tab_5_contents" class="tab"><span>Impressum</span></a></li>
  </ul>

何卒よろしくお願い申し上げます。どうもありがとう

4

1 に答える 1

0

こんにちは、追加しようとしましたfloat #tabs_container ul.tabsか#tabs_container ul.tabs li a

#tabs_container ul.tabs {
     float:left;
    border:1px solid red;
list-style: none;
border-bottom: none;
height: 25px; 
margin: 0px;

  }

  #tabs_container ul.tabs li a {
float:left;
padding: 6px 9px;
display: block;
border-left: 1px solid #90afcb;
border-top: 1px solid #90afcb;
border-right: 1px solid #90afcb;
border-bottom: 1px solid #90afcb;
margin-right: 4px;
text-decoration: none;
background-color: #ffffff;
    }
于 2013-03-08T04:47:54.103 に答える