. "••.•..o:t.'ll ,,.•·<~~>'..r~ t~•: .., , .,.._... ..,:c.ot~w ь-,c-•f'•,..~• "•., "~...., " ''~ "• '"' "' ••:
'.ц!Of\:lh(!'lt \,..\.~·1>/0'·.'" ,.-,"" ............
Рис. 8.12. Плавающие элементы, расnоложенные рядом друг с другом, - один иэ сnособов
Имитации столбцов и строк таблицы
Измените ширину окна браузера так, чтобы оно стало уже или шире, и понаблю-
Дайте, как перераспределяются изображения. Вы увидите, что не совсем все правильно.
Во второй строке изображений имеется два пустых места, где должны
Располагаться фотографии. Эта проблема возникает по той причине, что подпись
Ко второму изображению на первой строке более высокая, чем другие на этой же
Строке. Изображения, которые переносятся на эту подпись , не могут разместиться
Рядом (об этой путанице, имеющей место при использовании свойства
float, читайте в раэд. «Управление обтеканием содержимого плавающих элементов•
Гл. 7). К счастью, сушествует простое решение этой проблемы.
Совп----------------------------------------------------
Существует сnособ избежать этой nроблемы со странным отображением, о которой говорилось
В шаге 5, а также создать галерею, сnособную обрабатывать различные по высоте изображения.
Вместо того чтобы использовать свойство float, вы може1'е указать display: iпline-Ыock в стиле .figure.
Таким образом, каждая пара «изображение/надnись» будет обрабатываться как блок (область,