Как загрузить jpg-файлы в одно общее длинное горизонтальное изображение?

Question

Я пишу галерею изображений, и я не использую библиотеки. Я загружаю jpg-файлы из определенного каталога. Я хочу, чтобы собрать загруженные «uniq_image» изображения в один длинный горизонтальный изображение «moving_image» для того, чтобы прокручивать их вместе

CSS-код файла:

//the common long horizontal image that I want to assemble from uniq_images 
#moving_image { 
    background-repeat: no-repeat; 
    position: relative; 
    border:1px dashed red; 
    width: 420px; 
    height: 130px; 
    left: 10px; 
    overflow:hidden; 
} 
//the style for each uploaded image from the file 
#uniq_image { 
    background-repeat: no-repeat; 
    border:1px solid blue; 
    width: 150px; 
    height: 120px; 
    overflow:hidden; 
} 

HTML-файл с кодом загрузки PHP внутри него:

.... 
<td width ="420" height="130" overflow="hidden"> 
    <div id= "moving_image" > 
     <?php 
      $img_folder = 'picture'; 
      $dir = dir($img_folder); 
      while (($file = $dir->read()) !== false){ 
       echo '<img src="'.$img_folder."/".$file.'" style="uniq_image" >'; 
      } 
      $dir->close(); 
      ?> 
     </div> 
<td> 

Что я могу здесь пропустить? Благодарю.

Answer 1

Вам не хватает только оснований.

Вы должны определить стиль класса с помощью .uniq_image. #uniq_image - это правило для идентификатора, и у вас может не быть нескольких элементов с одинаковым идентификатором.

И изменить style="uniq_image" на class="uniq_image". Свойство style предназначено для определения встроенных правил стиля.

Могут быть и другие проблемы, но начните с этих изменений. Также, пожалуйста, рассмотрите еще несколько вопросов, прежде чем приступать к реализации таких вещей, потому что у вас все перепутано.