/ / таблица, приложена от div - html, css

таблица, приложена от div - html, css

Имам една маса в раздел 1.

Тогава след това div 1 добави още div 2 спозиция: относителна; отгоре: -250; така че слой div 2 ще бъде точно над масата. Но сега под масата има голямо пространство, преди всичко на страницата да може да се възобнови (предполагам, че второто Div 2 обикновено нямаше промяна на позицията -250) Как да се отърва от пространството и да го изчистя? Опитах това ...

<div style="clear:both;"></div>

... и не направи нищо

Страницата е тук ...

http://www.gootar.com/drums/metronome.html

Аз наистина се нуждая от начин да имам слой, в който мога да пиша текст (като номер 2) точно над таблицата. Има ли лесен начин да направите това?

Има ли голямо пространство, преди да се пускат бутоните за игра без причина?

Update:

Направих това след съвет на Fraxtil:

Използване на позиция: абсолютно; горна граница: -250px; изглежда е решението, което търсите.

също с ляво: 375;

.. и това работи,

но ще спечелите това, което прави дивизията винаги точно там? Какво ще стане, ако масата промени позицията на страницата? Мога ли да направя това, за да може тя да бъде пряко свързана с позицията на масата по някакъв начин?

Отговори:

0 за отговор № 1

Използвайки position: absolute; margin-top: -250px; изглежда е решението, което търсите.


0 за отговор № 2

В отговор на актуализацията ви, div ще се придвижва във връзка с него непосредствен контейнер, нещо, за което много хора не знаят, защото това не е толкова очевидно.

Как се позиционират абсолютните елементи

Абсолютно, като режим на позициониране, определя товапозиционираната позиция трябва да бъде премахната от нормалния поток на документа, позиционирана абсолютно по отношение на позицията на контейнера в потока на документа, а всички елементи под него се придвижват нагоре.

Координатите, които посочвате, са изместване, а не абсолютна позиция. Това означава, че казвате: "Отидете наляво до 20 пиксела и нагоре до 15". Не казвате "Отидете в позиция 20 отляво и 15 отляво". Ако казахте това второ условие, тогава div никога няма да се премести от позиция 20x15 и ще имате проблем (имайте предвид, че можете да използвате и ширина и височина тук).

Вашият "абсолютно" позициониран елемент е всъщност относително разположена в контейнера си. Браузърът е отговорен да гарантира, че те ще останат в определено разстояние един от друг, като използват информацията за стил, посочена в листа с стилове.

Как се идентифицира контейнерът

Сега въпросът става, Офсет от какво? И това е трикът. Обикновено това е непосредственият контейнер на елемента. Но това не е толкова просто. Всеки път, когато прилагате позициониране към елемент, този елемент става контейнер.

Съдържащият блок за абсолютно позициониран елемент е или:

  • Най-близко разположеният предшественик (най-близкия елемент извън абсолютно позиционирания елемент, който има позиция на фиксирана, абсолютна или относителна), -OR-
  • Първият съдържащ елемент (прозореца на браузъра).

Ако вашият елемент не е поставен в друг позиционирана елемент, неговият контейнер вероятно е прозорецът. Че ще защото тя се държи като елемент с фиксирана позиция и няма да се движи (Е, може би: но спрямо лява и горна част на прозореца, което вероятно не е това, което искате.)


Този урок (не моят) обхваща позиционирането на CSS доста добре. Тя е дълга и има досаден магьосник интерфейс, но тя свърши работата.