Плавающие div iCSS

Question

Плавающие div iCSS

Моя фотография объясняет, что я пытаюсь сделать, все, что я пробовал, ломается,

position: fixed; breaks when moving horizontal browser window size.

position: absolute; breaks when moving scrollbar down.

div1 - изображение div2-4 - кнопки css.

enter image description here

0

добавлено 09 Январь 2013 в 03:46 автор Darkmage отредактировано 09 Январь 2013 в 03:54

Просмотры: 3

источник

nl ja de

im пытается поплавать 3 кнопки в правой части Div1, но не уверен, как заставить его работать

добавлено 09 Январь 2013 в 03:53, автор Darkmage, источник

да, это важно, они находятся рядом с div 1

добавлено 09 Январь 2013 в 04:07, автор Darkmage, источник

Можете быть более конкретными? Я сейчас чувствую, что ты хочешь

добавлено 09 Январь 2013 в 03:49, автор Christian Werther, источник

Имеет ли значение для вас, если divs 2-4 внутри или рядом с div 1?

добавлено 09 Январь 2013 в 04:00, автор Forty-Two, источник

3 ответы

Видеокурс "Создание приложений для Android"

Получи множество видеоуроков по Android сейчас

Что-то вроде этого:

JSBin

Добавьте границу blue , как : синий 5px, (вам нужно изменить ширину и высоту , если вы будете использовать границу ).


Пример с контейнером  :
 JSBin_2 
Я бы посоветовал вам использовать  fixed width  ( not% ).



2

добавлено 09 Январь 2013 в 03:55
автор Vucko



источник









Видеокурс по Java для начинающих
Получи видеокурс по Java для начинающих с упражнениями






Используйте  float: left  для div 1 и  float: right  для div2 - 4. Также установите ширину для родительского контейнера (синий квадрат на вашем снимке).


2

добавлено 09 Январь 2013 в 03:52
автор reekogi



источник










Система управления ссылками ReDirector 3.0
Автор: Евгений Попов




 

HTML:
<div id="div1">
Div1
</div>

<div id="div2">
Div2
</div>

<div id="div3">
Div3
</div> 

<div id="div4">
Div4
</div>

CSS:
#div1,#div2,#div3,#div4{
background:#c00000;
}

#div1{
width:450px;
height:150px;
float:left;
padding:10px;
}

#div2,#div3,#div4{
width:160px;
margin-left:480px;
margin-bottom:10px;
padding:10px;
}



1

добавлено 09 Январь 2013 в 04:08
автор Revan



источник

автор reekogi · Answer 1 · 2013-01-09T03:52Z

Используйте float: left для div 1 и float: right для div2 - 4. Также установите ширину для родительского контейнера (синий квадрат на вашем снимке).

автор Revan · Answer 2 · 2013-01-09T04:08Z

HTML:

<div id="div1">
Div1
</div>

<div id="div2">
Div2
</div>

<div id="div3">
Div3
</div> 

<div id="div4">
Div4
</div>

CSS:

#div1,#div2,#div3,#div4{
background:#c00000;
}

#div1{
width:450px;
height:150px;
float:left;
padding:10px;
}

#div2,#div3,#div4{
width:160px;
margin-left:480px;
margin-bottom:10px;
padding:10px;
}