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



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

При наложении 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 275 сообщений
  • Репутация: 56

Отправлено 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

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

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

Я его поставил, когда допустил в коде ошибку, и думал что content перекрывает flower. Тогда же и исправил ошибку, и на индекс забил. Сейчас убрал - рамка осталась :blink:
  • 0

#12 gaaarfild
gaaarfild
  • Неактивные
  • 596 сообщений
  • Репутация: 0

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

Так напиши
border: 0;
padding:0;
margin:0;

И еще проверь, в размерах все ли правильно просчитал?
  • 0

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

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

Такой код не помогает, потомучто это не border (можно написать толщину 1 и тогда рамки просто будет две), размер верный, и даже он ни на что не влияет. Divки там наложены друг на друга, тоесть промежутков там между ними нет, и бг черный, были бы промежутки - рамка черная была бы) Что-то прям тайна призрачной рамки какая-то :blink:
  • 0

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

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

ну ты даешь, всех озадачил, а рамка-то в самом изображении, обреж по 2 пикселя по краям и рамка уйдет, увеличь исходное изображение и увидешь!
  • 0

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

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

Ахах, ну я и кадр. У меня было подозрение. Я даже пару раз изображение открывал, но без пристального зума не видно было ни какой линии, там края чуть светлее были. Спасиб что заметил xDDD
  • 0

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

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

Ну и чудак! Себе голову ломал, сидел тут в теме весь день и других озадачил :-D
Тему закрываю)
  • 0

#17 ZiTosS
ZiTosS
  • Неактивные
  • 5 148 сообщений
  • Репутация: 8

Отправлено 01 Июль 2010 - 23:25

Не успел озадачиться, интересно было почитать :blink:
  • 0

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


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

Пользователь месяца
BLIK BLIK 1-й за Ноябрь
Очков активности: 672 0 тем, 32 сообщения, 14 баллов репутации
ТОП самых активных за этот месяц
  • Фотография BLIK
    #1

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

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

    Victim
    Очков активности: 18 0 тем, 6 сообщений, 2 балла репутации

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

    kolver
    Очков активности: 15 1 тема, 7 сообщений, 1 балл репутации

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

    Rodiola (rukodelkovo.ru)
    Очков активности: 15 Вне конкурса за определение пользователя месяца

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

    MattCutts (dmitrylee.ru)
    Очков активности: 9 Вне конкурса за определение пользователя месяца

  • Фотография HITMAN84
    #6

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

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

    Vmir
    Очков активности: 6 0 тем, 2 сообщения, 2 балла репутации

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

    NataliaAntalia (zdorovemedicina.ru)
    Очков активности: 6 Вне конкурса за определение пользователя месяца

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

    morvad24
    Очков активности: 6 1 тема, 1 сообщение, 1 балл репутации

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

    iiccarus
    Очков активности: 6 1 тема, 1 сообщение, 1 балл репутации

  • Показать весь ТОП 10
Поддержите форум! =)
Апдейты
  • Яндекс ИКС: 29.11.2019
  • Яндекс выдача: 08.12.2019
Топ 5 участников по репутации

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