Перейти к содержимому


Пользователь месяца
WGN WGN 1-й за Июль
Очков активности: 850 2 темы, 75 сообщений, 7 баллов репутации
Сайт: worldgamenews.com
ТОП самых активных за этот месяц
  • Фотография TimurR
    #1

    TimurR
    Очков активности: 372 3 темы, 22 сообщения, 8 баллов репутации

  • Фотография WGN
    #2

    WGN (worldgamenews.com)
    Очков активности: 75 Вне конкурса за определение пользователя месяца

  • Фотография ShowPrint
    #3

    ShowPrint (ShowPrint.ru)
    Очков активности: 72 0 тем, 8 сообщений, 6 баллов репутации

  • Фотография BlackLion
    #4

    BlackLion
    Очков активности: 36 0 тем, 24 сообщения, 1 балл репутации

  • Фотография Vmir
    #5

    Vmir
    Очков активности: 25.5 Вне конкурса за определение пользователя месяца

  • Фотография Napoleon-007
    #6

    Napoleon-007
    Очков активности: 21 0 тем, 14 сообщений, 1 балл репутации

  • Фотография Ixman
    #7

    Ixman (o5cat.ru)
    Очков активности: 21 0 тем, 7 сообщений, 2 балла репутации

  • Фотография alekswebart
    #8

    alekswebart
    Очков активности: 19.5 1 тема, 10 сообщений, 1 балл репутации

  • Фотография r0mZet
    #9

    r0mZet (rz-style.ru)
    Очков активности: 18 2 темы, 6 сообщений, 1 балл репутации

  • Фотография bor10811
    #10

    bor10811
    Очков активности: 15 2 темы, 4 сообщения, 1 балл репутации

  • Показать весь ТОП 10

Kwork.ru - услуги фрилансеров от 500 руб.

Поддержите форум! =)
Апдейты
  • Яндекс тИЦ: 19.11.2017
  • Яндекс выдача: 21.08.2018
Топ 5 участников по репутации


Как убрать расстояние которое остается после смещение блока? (стр. 2)

#11 lordamid

lordamid
    Topic Starter
  • Неактивные
  • 13 сообщений
  • Репутация: 0
1

Отправлено 16 April 2013 - 17:07

о... оно... если прикинуть сколько потеряно времени это капец...
мог бы поставить пивас поставил бы безоговорочно...
растягивание на высоту страницы и т.д. не нужно...
Огромное спасибо... :)
  • 0

#12 html-ka

html-ka
  • Неактивные
  • 455 сообщений
  • Репутация: 82

Отправлено 16 April 2013 - 17:09

рад, что ты понял :)
  • 0

#13 lordamid

lordamid
    Topic Starter
  • Неактивные
  • 13 сообщений
  • Репутация: 0

Отправлено 16 April 2013 - 17:10

что значит опыта маловато... :)
  • 0

#14 html-ka

html-ka
  • Неактивные
  • 455 сообщений
  • Репутация: 82

Отправлено 16 April 2013 - 17:16

это дело наживное, а то, что голова работает, это самое важное, ведь понял с полуслова :)
  • 0

#15 lordamid

lordamid
    Topic Starter
  • Неактивные
  • 13 сообщений
  • Репутация: 0

Отправлено 16 April 2013 - 17:18

Еще раз спасибо. Что получилось в итоге покажу через пару дней...
  • 0

#16 html-ka

html-ka
  • Неактивные
  • 455 сообщений
  • Репутация: 82

Отправлено 16 April 2013 - 17:24

с удовольствием оценю, сам вспоминаю бессоные ночи в поиске решений, да и щас бывает )))))))))))))
  • 0

#17 lordamid

lordamid
    Topic Starter
  • Неактивные
  • 13 сообщений
  • Репутация: 0

Отправлено 18 April 2013 - 23:45

ЗЫ - этот шаблон на коленке за 5 минут можно сверстать :)

как-то так подумал и я пока не пришел домой и не проверил... Еще день бился головой о стенку... В итоге с одной проблеммы перелез на другую и можно сказать остался на том же месте что и был.
Помогите дельным советом как с этим бороться... А описание ЭТОГО ниже.

Собственно говоря действительно, начальную проблемму с отступом внизу margin решил... Но появилась другая.

Суть в том, что по дизайну фон блоков имеет прозрачность. И вот когда центральный блок поднимается в верх, получается накладывание одного фона на другой.

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

Код html страницы
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <script src="javascript/jquery-1.5.min.js" type="text/javascript"></script>
  <script src="/equalHeight.js" type="text/javascript"></script>
  <link rel=stylesheet type=text/css href='resset.css'>
  <link rel=stylesheet type=text/css href='style.css'>
</head>
<body>
<div id="content_box">
  <div id="content_box_top"></div>
  <div id="content_box_center">
   <div id="content">баба яга против</div>
  </div>
  <div id="content_box_bottom"></div>
</div>
</body>
</html>

Код CSS

body	 {
	  background-color: #000000;
	  }
#content_box   {
	  margin: 10px auto;
	  width: 685px;
	  }
#content_box_top  {
	  background-image: url(content-box-top-transparency70.jpg);
	  filter: alpha(Opacity=70);
	  opacity: 0.7;	
	  width: 685px;
	  height: 268px;
	  }
#content_box_center  {
	  background-image: url(content-box-repit-vertical-transparency70.jpg);
	  filter: alpha(Opacity=70);
	  opacity: 0.7;	
	  width: 685px;
	  }
#content_box_bottom  {
	  background-image: url(content-box-bottom-transparency70.jpg);
	  filter: alpha(Opacity=70);
	  opacity: 0.7;	
	  width: 685px;
	  height: 49px;
	  }
#content	{
	  filter: alpha(Opacity=100);
	  opacity: 1.0;
	  width: 650px;
	  height: 250px;
	  margin: -200px auto 0;
	  color: #FFFFFF;
	  }

Картинка scr1.png так должно быть в идеале только текст должен быть в верху.
Картинка scr2.png так получается если использовать маргин... ;)
Ну и архив с моим творчеством...

Прикрепленные изображения

  • scr1.png
  • scr2.png

Прикрепленные файлы

  • Прикрепленный файл  www.rar   5.06К   Количество загрузок: 79

  • 0

#18 html-ka

html-ka
  • Неактивные
  • 455 сообщений
  • Репутация: 82

Отправлено 18 April 2013 - 23:59

не до конца понимаю, что ты хочешь, а что тебе мешает положить content-box-repit-vertical-transparency70.jpg под все слои т.е. вот Прикрепленный файл  Desktop.rar   5.09К   Количество загрузок: 86

зы было бы неплохо, чтоб ты более яснее излагал свои мысли :)
  • 0

#19 yury

yury
  • Пользователь
  • 642 сообщений
  • Репутация: 188

Отправлено 19 April 2013 - 14:16

lordamid,
есть подозрение, что вам подойдет примерно такая структура верстки (на всякий случай: отрицательный margin-top неадекватно воспринимается в ИЕ6):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>tst</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
*{
  margin: 0;
  padding: 0;
}
.main{
  position: relative;
  background: #999;
}
.wrapper{
  padding: 50px 50px 0 50px;
}
.content{
  position: relative;
  background: #969;
  min-height: 150px;
  //height: 150px;
  z-index: 2;
}
.top{
  position: absolute;
  width: 100%;
  height: 100px;
  background: #ccc;
  z-index: 1;
}
.bot{
  height: 100px;
  background: #666;
}
</style>
</head>
<body>
<div class="main">
  <div class="top"></div>
  <div class="wrapper"><div class="content">Dynamic content goes here</div></div>
  <div class="bot"></div>
</div>
</body>
</html>

  • 0

#20 lordamid

lordamid
    Topic Starter
  • Неактивные
  • 13 сообщений
  • Репутация: 0

Отправлено 19 April 2013 - 18:09

а как быть с прозрачностью в этом случае? будет накладываться?
  • 0

robot

robot
  • Пользователь PRO
  • 2652 сообщений
  • Репутация: 85


Похожие темы

  Название темы Автор Статистика Последнее сообщение

Оформление форума – IPBSkins.ru