동일한 속성을 가진 테이블 대신 어떤 요소를 사용할 수 있습니까?

Question

나는 같은 크기의 사진이 많아 슬라이드 쇼용으로 사용하고 싶습니다. 그래서 그들은 한 행에 있어야하고 어쩌면이 행의 너비가 창 너비보다 커야하고 일부 사진을 다음 줄에 표시하는 대신 화면 밖으로 나오기를 원합니다. 지금은 전에 내가 한 행에서 그들을 만들기 위해 테이블을 사용하고 난 그냥이 슬라이드 쇼를 만들기 위해 테이블을 이동 [이 같은 :].

<table cellspacing="0" cellpadding="0"> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    ... 
</table> 

하지만 난 약간의 CSS로 예를 들어 [사업부를 다른 요소를 사용하려면 해당 테이블과 같은 속성을 가진 규칙] 테이블에 내 페이지에 문제가 있기 때문에

Answer 1

최소한의 코드와있는 솔루션 아니오 " 해킹 ". DEMO

Answer 2

일반적으로 이러한 슬라이더 플러그인에는 정렬되지 않은 목록이 사용되지 않습니다.

li{float:left;} 

이에

<ul> 
    <li><img .../></li> 
    <li><img .../></li> 
    <li><img .../></li> 
</ul> 

사용하면 <li> 요소 (예를 들면 화상의 설명 + + 단문)에 더 많은 요소를 넣을 수 있다는 장점을 갖는다.

하지만 그룹화 더 많은 요소 (이미지에 대해 예를 들어 설명) 추가 된 div로 포장해야을 원하는 경우에 당신은뿐만 아니라

<div> 
    <img /> 
    <img /> 
</div> 

일반 사업부를 사용할 수 있습니다. (효과적으로 다시 UL에 당신을 제공하는 ...)

<div> 
    <div><img /> Text</div> 
    <div><img /> more Text</div> 
</div> 

그리고 단지 정보 당신을위한 테이블을 사용하는 올바른 방법은 다음과 같습니다

<table> 
    <tr>  <!-- the row --> 
    <td></td> <!-- columns --> 
    <td></td> <!-- columns --> 
    </tr> 
</table> 

Answer 3

<div style="white-space:nowrap;"> 
     <img src="..." /> 
     <img src="..." /> 
     <img src="..." /> 
     <img src="..." /> 
     <img src="..." /> 
     <img src="..." /> 
     ... 
    </div> 

안녕하세요 지금

<div class="slideshow"> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    <img src="..." /> 
    ... 
</div> 

CSS를

.slideshow{ 
white-space: nowrap; 
} 
.slideshow img{ 
vertical-align:top; 
}