Jump to content
  • 0

Пустота на месте перемещенного элемента разметки


aruru
 Share

Question

Имеется разметка, имеется объект html (пусть таблица или div), позиция которой указывается в style. Браузер считает, что несмотря на указанные координаты, для этого объекта нужно оставить пустое место там, где объект был описан. (Т.е. там объект находился бы, если бы не были вручную указаны координаты). Как сделать, чтобы не появлялось это пустое место? Ткните пожалуйста в то место матчасти которое содержит объяснение. Что-то упускаю.

Ещё раз: задача - класть на странице произвольное количество объектов произвольного размера, так, чтобы не появлялись пустые места на месте их описания. Свойство display не спасает. Пока display=none, все ок, но при других значениях вылезают пустоты.

Или, совсем другими словами: объект должен размещаться в своих установленных размерах, но браузер не должен выделять ему никакого места на странице. И тогда объект "ляпается" поверх всего что попадается, его размер считается браузером нулевым (хотя реально это не так).

"Обманный" вариант, когда запрещается прокрутка страницы при вылезании элементов за пределы экрана, а "блуждающий" элемент размещается как раз за пределами - не годится: как раз нужно чтобы прокрутка была.

Link to comment
Share on other sites

9 answers to this question

Recommended Posts

  • 0

:rolleyes: простой пример

<div>aaa</div>
<div style="position:relative;top:40px;">bbb</div>
<div>ccc</div>

Вот этот код дает тот же визуально результат что и

<div>aaa</div>
<br>
<div>ccc</div>
<div>bbb</div>

Согласны?

Потому что остается пустое место там, где был bbb

Задача!

Так описать <div .....>bbb</div>, чтобы НЕ ПОЯВИЛОСЬ пустого места между aaa и ccc

То есть, как если бы код был вот такой:

<div>aaa</div>
<div>ccc</div>
<br>
<div>bbb</div>

Т.е. меня интересует некое волшебное свойство))) благодаря которому код

<div>aaa</div>
<div style="position:relative;top:40px;magic:true;">bbb</div>
<div>ccc</div>

браузером отобразился бы также как

<div>aaa</div>
<div>ccc</div>
<br>
<div>bbb</div>

...другой пример. Представьте, что вы решили посреди страницы вставить десять больших изображений, задав им разные координаты в разных местах страницы. Угадайте, что будет посреди страницы? Пустое место, как раз где написаны все эти<img style="...координаты...">, и это некрасиво, а ЗАДАЧА сделать так чтобы пустое место НЕ образовывалось.

Link to comment
Share on other sites

  • 0

Вот это другое дело, это уже предметный разговор, а то я не силен в ментальном анализе потока сознания...

:rolleyes:

 	<div>aaa</div>
<div style="position: relative; top: 2em;">bbb</div>
<div style="position: relative; top: -1em;">ccc</div>

Так?

Вообще-то, вам стоит формализировать всю задачу в целом, может быть мы боремся с ветряными мельницами..

Link to comment
Share on other sites

  • 0

:rolleyes:

Окей. Представьте что у вас на странице, такой красивой, есть скрытая форма, которая открывается при нажатии ссылки или кнопки. Ну, форма для отправки сообщения. Или картинка какая. Неважно. Но вот беда, пока форма скрыта (display=none), все хорошо, а когда она появляется, даже если она в html коде описывается в самом конце, справа появляется ползунок. А его быть не должно. Или он должен быть, но не должно появляться внизу тупого пустого пространства. И не потому что кто-то из юзеров его заметит :( А потому что, например заказчик тупой и требует чтобы косяков не было никаких. Ваще. Ваши действия :)

Или потому что исполнитель тупой извращенец и не знает элементарных вещей. Такой вариант тоже принимается к рассмотрению :(

:)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy