Как расположить дивы в ряд?

@EK · Регистрация: 16.02.2012

Студворк — интернет-сервис помощи студентам

Здрасте!

Есть код:

CSS
1
2
3
4
5
6
7
#all {border:1 solid #000; width:900px; height:700px;}
 
#logo {position:absolute; background:url("logo.png"); width:178px; height:120px; margin:60px 25px;}
 
#karta {background:url("2.png"); width:106px; height:106px; margin:0 254px;}
 
#photo {background:url("1.png"); width:120px; height:90px; margin:60px 370px;}

HTML5
1
2
3
4
5
<div id="all">
   <div id="logo"></div>
   <div id="karta"></div>
   <div id="photo"></div>
</div>

результаты выполнения которого можно увидеть здесь: http://t234.aiq.ru/HTML/ya.html.
logo - логотип яндекса
karta - пластиковая карточка
photo - оставшаяся фаотка

Я хочу сделать так, чтобы все три картинки располагались не друг под другом, а рядом, т.е. каждая следующая справа от предыдущей.
Раньше я это делал, задавая всем картинкам position:absolute, но мне сказали, что много position в коде - не очень хорошо.

Подскажите, пожалуйста, правильный вариант размещения 3-х и более дивов в один ряд.

@acupation · 17.02.2012, 13:19

создайте в CSS класс и присвойте ему absolute. Далее картинке или диву просто подставляете этот класс.
П.С. Используйте теги форматирования кода.

@etalord · 17.02.2012, 14:34

HTML5
1
#all div {float:left}

и у #logo надо убрать position:absolute;

Новые блоги и статьи Все статьи Все блоги /
влияние грибов на сукцессию anaschu 26.01.2026 Бифуркационные изменения массы гриба происходят тогда, когда мы уменьшаем массу компоста в 10 раз, а скорость прироста биомассы уменьшаем в три раза. Скорость прироста биомассы может уменьшаться за. . .	Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .
Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .	моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .

@acupation 67 / 67 / 6 Регистрация: 26.03.2010 Сообщений: 546
	17.02.2012, 13:19
	создайте в CSS класс и присвойте ему absolute. Далее картинке или диву просто подставляете этот класс. П.С. Используйте теги форматирования кода. 0