X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

4 страниц V   1 2 3 4 >
Открыть тему
Тема закрыта
> Как убрать расстояние которое остается после смещение блока?
lordamid
lordamid
Topic Starter сообщение 16.4.2013, 15:49; Ответить: lordamid
Сообщение #1


Новичок
*

Группа: User
Сообщений: 13
Регистрация: 16.4.2013
Из: Киев
Поблагодарили: 0 раз
Репутация:   0  


Доброго времени суток. Мой вопрос пожалуй может показаться глупым но никак не могу его решить. Застрял на нем и все тут. Помогите пожалуйста.

Как убрать промежуток который остается после перемещения блока dynamic_content
На картинке желтая полоса.

Спасибо.

html файл
<html>

<head>
<link rel="stylesheet" title="screen style" type="text/css" href="style.css">
</head>
<body>
<div id="main_unit">
  <div id="main_unit_top"></div>
  <div id="main_unit_center">
   <div id="dynamic_content"></div>
  </div>
  <div id="main_unit_bottom"></div>
</div>
</body>
</html>



css файл
body     {

      background-color: #000000;
      }
    
#main_unit    {
      width: 200px;
      margin: 0 auto;
      border: 1px solid red;
      }
    
#main_unit_top   {
      background-color: #FFFFFF;
      height: 100px;
      border: 1px solid yellow;
      }
    
#main_unit_center  {
      background-color: #FFFFFF;
      border: 1px solid green;
      }
    
#main_unit_bottom  {
      background-color: #FFFFFF;
      height: 50px;
      border: 1px solid purple;
      }
#dynamic_content  {
      position: relative;
      top: -75px;
      background-color: blue;
      width: 150px;
      height: 250px;
      margin: 0 auto;
      border: 1px solid red;
      }


Результат на картинке
Эскизы прикрепленных изображений
Прикрепленное изображение
 
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
isvetlichniy
isvetlichniy
сообщение 16.4.2013, 16:34; Ответить: isvetlichniy
Сообщение #2


Завсегдатай
*****

Группа: User
Сообщений: 622
Регистрация: 28.11.2012
Поблагодарили: 0 раз
Репутация:   93  


задай фиксированную высоту для #main_unit_center , например вот так

#main_unit_center  {
          background-color: #FFFFFF;
          border: 1px solid green;
          height: 180px;
          }
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
lordamid
lordamid
Topic Starter сообщение 16.4.2013, 16:48; Ответить: lordamid
Сообщение #3


Новичок
*

Группа: User
Сообщений: 13
Регистрация: 16.4.2013
Из: Киев
Поблагодарили: 0 раз
Репутация:   0  


Спасибо, за совет. Но дело в том что данный скрин это только схематическое изображение сайта.
Блок dynamic_content имеет динамическое наполнение и меняет свою высоту в зависимости от количества информации находящейся в нем.
И если я задам блоку main_unit_center фиксированную высоту а dynamic_content изменится на пару десятков строк в итоге получим примерно следующее...
Эскизы прикрепленных изображений
Прикрепленное изображение
 
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
isvetlichniy
isvetlichniy
сообщение 16.4.2013, 16:57; Ответить: isvetlichniy
Сообщение #4


Завсегдатай
*****

Группа: User
Сообщений: 622
Регистрация: 28.11.2012
Поблагодарили: 0 раз
Репутация:   93  


ну так вопрос же бы про отступы? :)

если хочешь динамическую структуру, попробуй вот с этими стилями


body     {
          background-color: #000000;
          }
#main_unit    {
          width: 200px;
          margin: 0 auto;
          border: 1px solid red;
          overflow: hidden;
          }
#main_unit_top   {
          background-color: #FFFFFF;
          height: 25px;
          border: 1px solid yellow;
          }
#main_unit_center  {
          background-color: #FFFFFF;
          border: 1px solid green;
          overflow: hidden;
          }
#main_unit_bottom  {
          background-color: #FFFFFF;
          height: 50px;
          border: 1px solid purple;
          }
#dynamic_content  {
          background-color: blue;
          width: 150px;
          height: 250px;
          margin: 0 auto;
          border: 1px solid red;
          overflow: hidden;
          }
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
lordamid
lordamid
Topic Starter сообщение 16.4.2013, 17:12; Ответить: lordamid
Сообщение #5


Новичок
*

Группа: User
Сообщений: 13
Регистрация: 16.4.2013
Из: Киев
Поблагодарили: 0 раз
Репутация:   0  


Наверное проще было сделать скрин сайта... :angry:
Блок main_unit_top имеет фиксированную высоту и ширину потому что на фоне у него картинка которая стартует с блока main_unit_top затем однопиксельная (по высоте) картинка делает фон для всего блока main_unit_center, и уже в блоке main_unit_bottom идет завершение этой картинки.
Если бы блок main_unit_top можно было уменьшить то у меня и голова наверное не болела бы :) уже вторую неделю бьюсь. Здался решил к более опытным людям обратиться нежели я ;)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
isvetlichniy
isvetlichniy
сообщение 16.4.2013, 17:15; Ответить: isvetlichniy
Сообщение #6


Завсегдатай
*****

Группа: User
Сообщений: 622
Регистрация: 28.11.2012
Поблагодарили: 0 раз
Репутация:   93  


ну значит формулируй понятно вопрос, а гадать - эти к гадалке
давай адрес или скрин сайта
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
lordamid
lordamid
Topic Starter сообщение 16.4.2013, 17:32; Ответить: lordamid
Сообщение #7


Новичок
*

Группа: User
Сообщений: 13
Регистрация: 16.4.2013
Из: Киев
Поблагодарили: 0 раз
Репутация:   0  


Я вот что думаю.
А что будет если разместить фон который должен быть в центре блока на фон блока main_unit.
В фон блоке main_unit_top фоном разместить картинку которая у него и должна быть. Только добавить параметр no-repeat.
Непосредственно в него запихнуть блок dynamic_content
А дальше уже после него пойдет main_unit_bottom.

Так прокатит?

ну значит формулируй понятно вопрос, а гадать - эти к гадалке
давай адрес или скрин сайта

сайт лежит дома на апаче а я на работе в пару свободных минут сижу размышляю как правильно сделать...
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
fedornabilkin
fedornabilkin
сообщение 16.4.2013, 17:35; Ответить: fedornabilkin
Сообщение #8


Старожил
******

Группа: User
Сообщений: 1192
Регистрация: 19.3.2013
Поблагодарили: 0 раз
Репутация:   206  


Ссылку давай и что желаешь увидеть.
Я с начала темы не понял что ты хотел, а в конце ты еще и передумал :)
Я уверен, что твоя проблема решена несколько лет назад, поэтому не теряй зря время на пустяки. Давай ссыль и будем посмотреть что у тебя там.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
lordamid
lordamid
Topic Starter сообщение 16.4.2013, 17:43; Ответить: lordamid
Сообщение #9


Новичок
*

Группа: User
Сообщений: 13
Регистрация: 16.4.2013
Из: Киев
Поблагодарили: 0 раз
Репутация:   0  


да я тоже уверен что проблема решена... просто найти ответ нигде не могу.
скрин выложу как доберусь с работы.
а в конце я не передумал, просто думаю каким образом можно решить эту бадягу...
Сори если не внятно изъясняюсь...
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
html-ka
html-ka
сообщение 16.4.2013, 17:55; Ответить: html-ka
Сообщение #10


Бывалый
****

Группа: User
Сообщений: 455
Регистрация: 19.3.2013
Поблагодарили: 0 раз
Репутация:   82  


я конечно дико извеняюсь, но зачем тут нужно позиционирование, когда тут достаточно использовать отрицатеьный margin-top, что поднять вверх нужный блок...продолжать? а как растянуть колонку на всю высоты страницы в Интернете как грязи, и спосомшью фоновой каритнки и с помошью javascript и ccs выбирай на вкус.
ЗЫ - этот шаблон на коленке за 5 минут можно сверстать :)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
4 страниц V   1 2 3 4 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Как обойти блокировку medium.com и reddit.com
7 aplodise 356 Вчера, 19:39
автор: SmoPromo
Открытая тема (нет новых ответов) Как удалить слэш в конце url через htaccess?
5 doktorcrabus 297 27.10.2020, 15:22
автор: miketomlin
Горячая тема (нет новых ответов) Как мы профукали форум?
60 wep 6397 26.10.2020, 19:02
автор: LigaGiga
Горячая тема (нет новых ответов) Как начать "в криптовалюты" с нуля?
69 Starpony 2394 26.10.2020, 18:47
автор: LigaGiga
Открытая тема (нет новых ответов) Спецпредложение "Коробка Битрикс24 в облаке: как перенести и сколько это стоит"
7 Tucha 708 26.10.2020, 12:47
автор: Tucha


 



RSS Текстовая версия Сейчас: 30.10.2020, 8:52
Дизайн