Элемент div отстает от другого, несмотря на то, что он расположен спереди.

  • Автор темы liska1
  • 22
  • Обновлено
  • 13, May 2024
  • #1
Привет, ребята, У меня другая проблема.

Я делал это уже сотый раз, но на этот раз это просто не сработало.

В моем мозгу ничего не было, я не трогал HTML как минимум 6 месяцев. Посмотрите на картинку и посмотрите на мой код.

Можете ли вы указать, что с ним не так? HTML:
 

.wrapper {

overflow: hidden;

max-width: 100%;

padding: 0 0.6em;

margin: 0 auto;

}

h1 {

float: left;

padding: 0.2em 1.5em 0.3em 0;

font: bold helvetica, sans-serif;

}

h1 a {

text-decoration: none;

color: #FFF;

}

.nav {

float: right;

text-align: right;

padding-top: 0.6em;

}

.nav li { display: inline; margin-left: 0.3em; }

.nav li:first-child { margin-left: 0; position: relative; }

#searchbox {

position: absolute;

z-index: 9;

top: 1.5em;

right: 0;

background: red;

padding: 0.6em;

box-shadow: 0 0 0.2em #888;

}

section {

position: relative;

background: #FFF;

}

Код (разметка): CSS:
  <header><div class=wrapper> <h1> <a href='index.php'>My Awesome Website</a> </h1> <ul class=nav> <li> <a href="#"><img id=search src="images/search.svg" /></a> <div id=searchbox> <form method=post action="#"> <input type=text name=search /> <input type=submit class=search_button value='search' /> </form> </div> </li> <li><a href="#"><img id=login src="images/enter.svg" /></a></li> </ul> </div></header> <!-- wrapper & header --> <section><div class=wrapper> </div></section> <!-- wrapper & section --> 
Код (разметка): я бы скрыл модальное окно и вызвал его с помощью события onclick в JavaScript.

Но обо всем по порядку: мне нужно, чтобы все работало с CSS.

Он должен располагаться поверх . Спасибо,

liska1


Рег
22 Mar, 2013

Тем
1

Постов
2

Баллов
12
Тем
49554
Комментарии
57426
Опыт
552966

Интересно