Позиция с css абсолютная и относительная

У меня есть небольшой проект, но у него длинный html-код, потому что я дам ссылку на него. ссылка: http://1zh.us/examples/position.html Позиция с css абсолютная и относительная

это то, что я хочу: , когда я прокрутка влево-вправо-влево я хочу желтый ДИВ пчелы фиксирован (не меняя положения), но когда я прокрутку вверх-вниз-вверх, я хочу зеленый дел до пчелы исправлено. Я пробовал все комбинации фиксированного, относительного и абсолютного позиционирования, но без результата. Надеюсь, что это можно сделать с помощью html5 и css.

взгляд на образец по ссылке и прокручивать его вверх-вниз слева направо, чтобы увидеть именно то, что я хочу спасибо за вашу помощь ...

<!doctype html> 
<html> 
<head> 
</head> 
<body><div id="randevu_sag" style="position:fixed; top:25px; left:235px; bottom:0px; right:0px; overflow:auto;"> 
<div id="rust" style="left:0px; top:0px; height:27px; width:1863px; background-color:green;"> 
<div style="position:relative; width:49px; height:25px; float:left; border-right:solid 1px #9a4b9d; border-bottom:solid 2px #000;">Saat</div> 
<div style="position:relative; margin-left:2px; width:299px; height:25px; float:left; border-right:solid 1px #9a4b9d; border-bottom:solid 2px #000;">Bolum1</div> 
<div style="position:relative; margin-left:2px; width:299px; height:25px; float:left; border-right:solid 1px #9a4b9d; border-bottom:solid 2px #000;">Bolum2</div> 
<div style="position:relative; margin-left:2px; width:299px; height:25px; float:left; border-right:solid 1px #9a4b9d; border-bottom:solid 2px #000;">Bolum3</div> 
<div style="position:relative; margin-left:2px; width:299px; height:25px; float:left; border-right:solid 1px #9a4b9d; border-bottom:solid 2px #000;">Bolum4</div> 
<div style="position:relative; margin-left:2px; width:299px; height:25px; float:left; border-right:solid 1px #9a4b9d; border-bottom:solid 2px #000;">Bolum5</div> 
<div style="position:relative; margin-left:2px; width:299px; height:25px; float:left; border-right:solid 1px #9a4b9d; border-bottom:solid 2px #000;">Bolum6</div> 
</div> 

<div id="ralt" style="left:0px; top:27px; width:1863px"> 
<div style="position:absolute; left:0px; width:49px; float:left; border-right:solid 1px #9a4b9d; background-color:yellow;"> 
<div id="1383890400" style="border-bottom:solid 1px #000; height:2225px; width:50px; overflow:hidden;"></div> 
</div> 
<div style="position:absolute; left:51px; float:left;"> 
<div style="position:absolute; left:0px; width:299px; float:left; border-right:solid 1px #9a4b9d;"> 
<div id="1383890400" style="border-bottom:solid 1px #000; border-left:solid 5px blue; height:2225px width:292px; overflow:hidden;">birinci</div> 
</div> 
<div style="position:absolute; left:302px; float:left; width:299px; border-right:solid 1px #9a4b9d;"> 
<div id="1383890400" style="border-bottom:solid 1px #000; border-left:solid 5px blue; height:2225px; width:292px; overflow:hidden;">ikinci</div> 
</div> 
<div style="position:absolute; left:604px; float:left; width:299px; border-right:solid 1px #9a4b9d;"> 
<div id="1383890400" style="border-bottom:solid 1px #000; border-left:solid 5px blue; height:2225px; width:292px; overflow:hidden;">ucuncu</div> 
</div> 
<div style="position:absolute; left:906px; float:left; width:299px; border-right:solid 1px #9a4b9d;"> 
<div id="1383890400" style="border-bottom:solid 1px #000; border-left:solid 5px blue; height:2225px; width:292px; overflow:hidden;">dorduncu</div> 
</div> 
<div style="position:absolute; left:1208px; float:left; width:299px; border-right:solid 1px #9a4b9d;"> 
<div id="1383890400" style="border-bottom:solid 1px #000; border-left:solid 5px blue; height:2225px; width:292px; overflow:hidden;">besinci</div> 
</div> 
</div> 
</div> 
</div> 
</body> 
</html>

источник

2013-11-08 mandza

добавить позицию: фиксированная для желтого сНу и зеленый DIV в вашем CSS –

Так же, как примечание стороны 'идентификатор = "1383890400" 'недопустимо, добавьте что-нибудь, даже' id = "row_1383890400" будет лучше. – ericjbasti

j08691 Я редактировал мое сообщение. спасибо, что предупредили меня. – mandza

Вы пытаетесь добавить:

yellow.div{ 
position:fixed; 

} 

green.div{ 
position:fixed; 
}

источник

2013-11-08 17:19:49

Его разметка не позволит этого, тем более, что исправлено желание начать с левого верхнего угла окна. Он мог сделать это для зеленого цвета с момента его появления в контейнере «ржавчиной», но, насколько это принесет его. – ericjbasti

фиксированная позиция не является решением для меня. потому что он исправил div и движение влево-вправо и вверх – mandza

Это моя рекомендация для желтой колонки

<div style="position:fixed; width:49px; float:left; border-right:solid 1px #9a4b9d; background-color:yellow;">

или в CSS

element.style { 
position: fixed; 
width: 49px; 
float: left; 
border-right: solid 1px #9a4b9d; 
background-color: yellow; 
}

источник

2013-11-08 17:24:55 Mutmatt

Я хочу уменьшить свой код и поместить его здесь как можно скорее. Но исправлено не то, что я ищу. Потому что, когда я поставил положение: исправлено; он фиксируется как x, так и y. то, что я хочу, когда я прокручиваю вверх, желтый div будет идти вверх и вниз, но не влево и вправо. также когда я прокручиваю его влево, желтый желтый div будет стабильным, а зеленый - влево и вправо. – mandza

Позиция с css абсолютная и относительная

ответ

Смежные вопросы