이미지가 jQuery 탭으로 채워지도록 CSS 변경

Question

jQuery 탭을 사용하여 이미지를 표시하고 있습니다.

html로도 viewable on jfiddle은 다음과 같습니다 이미지가 전체 탭을 채 웁니다 있도록

<div id="dgTabs" style="width: 500px;"> 
    <ul> 
     <li><a id="a1" href="tab-1"> 
      <img src="http://images.smh.com.au/2012/10/30/3754903/umbrella_tn-90x60.jpg" /></a></li> 
     <li><a id="a2" href="tab-2"> 
      <img src="http://images.smh.com.au/2012/10/30/3754903/umbrella_tn-90x60.jpg" /> </a></li> 
       <li><a id="a3" href="tab-1"> 
      <img src="http://images.smh.com.au/2012/10/30/3754903/umbrella_tn-90x60.jpg" /></a></li> 
     <li><a id="a4" href="tab-2"> 
      <img src="http://images.smh.com.au/2012/10/30/3754903/umbrella_tn-90x60.jpg" /> </a></li> 
      <li><a id="a5" href="tab-1"> 
      <img src="http://images.smh.com.au/2012/10/30/3754903/umbrella_tn-90x60.jpg" /></a></li> 
     <li><a id="a6" href="tab-2"> 
      <img src="http://images.smh.com.au/2012/10/30/3754903/umbrella_tn-90x60.jpg" /> </a></li> 
       <li><a id="a7" href="tab-1"> 
      <img src="http://images.smh.com.au/2012/10/30/3754903/umbrella_tn-90x60.jpg" /></a></li> 
     <li><a id="a8" href="tab-2"> 
      <img src="http://images.smh.com.au/2012/10/30/3754903/umbrella_tn-90x60.jpg" /> </a></li> 
    </ul> 
</div> 

어떻게 내가 CSS를 변경할 수 있습니까? 어떤 CSS 파일의 어떤 요소를 업데이트해야합니까? 기본적으로 나는 패딩이 필요 없다.

Answer 1

이 패딩 jquery-ui.css 파일에, 당신은 당신이

#tabs ul li, #tabs ul li a { 
    width: 15px; 
} 

을 다음과 같이해야 할 폭을 설정하려면

업데이트 패딩

#tabs .ui-tabs .ui-tabs-nav li a { 
    float: left; 
    padding: .5em 1em; 
    text-decoration: none; 

} 

아래 재정의해야