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


Выбрать шаблон и создать сайт

  • Закрытая тема Тема закрыта

При наложении div блоков, появляется рамочка

#1 AcidPrice

AcidPrice
  • Пользователь
  • 17 сообщений
  • Репутация: 0
0

Отправлено 29 Июнь 2010 - 09:54

Вот ради тренировки так сказать, решил я склепать обычную страничку. Естественно решил все раполагать div блоками, все было хорошо, пока не приспичило мне украсить центральный контентовый блок разными картиночками, так как я совсем не профи, решил все картиночки опять засунуть в div блоки и размещать их параметром
z-index. Вот тогда то и при наложении блоков друг на друга появилась эта непонятная рамочка.
Изображение
Выслушаю ваши советы по коду, где было бы лучше по другому, где вообще руки из попы. В общем страждуще ищу помощи)) И спасибо админу что снял запрет на необходимость 10 сообщений)
<html>
<head>
<title>
Abstact
</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<div id="head">
</div>
<div id="left">
</div>
<div id="content">
<div id="flower">
</div>
</div>
</head>
<body>
<div id="bottom">
</div>
</body>
</html>

* {
margin: 0;
padding: 0;
}
#head {
float: left;
background: black url(top.jpg) no-repeat left top;
height: 285px;
width: 100%;
border-width: 0px;
}
#left {
float: left;
background: black url(left.jpg) no-repeat;
height: 1295px;
width: 286px;
}
body {
background-color: black;
}
#bottom {
float: left;
background: black url(bottom.jpg) no-repeat left bottom;
height: 428px;
width: 100%;
}
#content {
border-width: 1px;
border-style: solid;
border-color: #291d0d;
position: absolute;
top: 285px;
left: 285px;
background: #140f09;
height: 1300px;
width: 70%;
z-index: 1;
}
#flower {
	float: left;
	background: url(flower.jpg) no-repeat;
	height: 153px;
	width: 176px;
	z-index: 2;
}

 

 

  • 0

#2 Matt

Matt
  • Пользователь
  • 774 сообщений
  • Репутация: 2

Отправлено 29 Июнь 2010 - 10:09

У вас в стиле блока content прописана рамка (border):

#content {
border-width: 1px;
border-style: solid;
border-color: #291d0d;
position: absolute;
top: 285px;
left: 285px;
background: #140f09;
height: 1300px;
width: 70%;
z-index: 1;
}
Просто уберите её (напишите 0 px или цвет сделайте как у фона)
  • 0

#3 AcidPrice

AcidPrice
    Topic Starter
  • Пользователь
  • 17 сообщений
  • Репутация: 0

Отправлено 29 Июнь 2010 - 10:29

Дак в блоке #content мне и нужна рамка, а вот в блоке #flower - нет. Если я к примеру напишу в блоке flower рамку, то их станет каким-то образом две) Я ж на картинке показал расположение всех блоков)
  • 0

#4 admin

admin
  • Пользователь PRO
  • 5 272 сообщений
  • Репутация: 54

Отправлено 29 Июнь 2010 - 10:36

#flower {
	float: left;
	background: url(flower.jpg) no-repeat;
	height: 153px;
	width: 176px;
	z-index: 2;
}
У вас прописана картинка, а её нет. Думаю поэтому и рамка появляется или у меня руки от туда же :blink:
  • 0

Сколько лет прошло, а ссылки всё ещё лучше покупать тут



#5 AcidPrice

AcidPrice
    Topic Starter
  • Пользователь
  • 17 сообщений
  • Репутация: 0

Отправлено 29 Июнь 2010 - 10:43

Ахах, нет. Картинка есть, и прекрасно отображается
Изображение
Это можно убедиться на первом скрине, без нее был бы просто коричневый блок #content в рамочке :blink:
  • 0

#6 Matt

Matt
  • Пользователь
  • 774 сообщений
  • Репутация: 2

Отправлено 29 Июнь 2010 - 10:44

Может она наследуется как раз от блока content? Вот бы страничку глянуть, есть проги, которые показывают, что от чего зависит и откуда появляется.
  • 0

#7 AcidPrice

AcidPrice
    Topic Starter
  • Пользователь
  • 17 сообщений
  • Репутация: 0

Отправлено 29 Июнь 2010 - 10:54

Не должно быть, я ведь сначала content поставил, никакой рамочки небыло. Добивил flower и вот появилась. Но все же вот ссыль на страничку Не удивляйтесь ее кривости :blink: Делал под свой монитор))
  • 0

#8 surfer

surfer
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71

Отправлено 29 Июнь 2010 - 11:39

картинки прикрепи вечером гляну, отображается во всех браузерах? какой доктайп?
  • 0

#9 AcidPrice

AcidPrice
    Topic Starter
  • Пользователь
  • 17 сообщений
  • Репутация: 0

Отправлено 29 Июнь 2010 - 11:47

Да, проверял в хроме, опере, дрим вивере. Доктайп не стал писать, все стандартно :blink: Картинки на форум прикрепить не могу, по этому выложил их вместе с полной страничкой на депозит. Ссылка выше :)
  • 0

#10 gaaarfild

gaaarfild
  • Пользователь
  • 596 сообщений
  • Репутация: 0

Отправлено 29 Июнь 2010 - 15:26

А для чего z-index, не поделишься секретом?
У тебя же не абсолютное позиционирование. z-index - это слои.
Попробуй убрать их.
  • 0

robot

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


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