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

Разбираемся в CSS
Ответить
Anonymous
 Z-индекс всегда уничтожает мой заголовок, как я могу это исправить?

Сообщение Anonymous »

Я хочу присвоить заголовку z-индекс, но каждый раз, когда я помещаю его в заголовок, он полностью уничтожается, и я не знаю, как я могу это исправить.
Кроме того, мои поля перекрывают мою навигационную панель/заголовок, могу ли я исправить это с помощью z-index?

Код: Выделить всё

body {
background-color: #fff;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.header {
position: fixed;
top: 0;
left: 0;
width: 100%;
padding: 19px 20px;
background: #DCdCdC
}

.logo {
position: fixed;
top: -10px;
font-size: 32px;
padding: 20px 20px;
color: #fff;
text-decoration: none;
font-weight: 650;
}

.navbar a {
font-size: 18px;
color: #fff;
font-weight: 600;
text-decoration: none;
margin-left: 400px;
word-spacing: 2px;
z-index: 1;
}

.products .box-container {
display: flex;
flex-wrap: wrap;
gap: 1.5rem;
}

.products .box-container .box {
flex: 1 1 30rem;
box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .1);
border-radius: .5rem;
border: .1rem solid rgba(0, 0, 0, .1);
position: relative;
transition: 1s;
z-index: 0;
}

.products .box-container .box .image {
position: relative;
text-align: center;
padding-top: 2rem;
overflow: hidden;
}

.box:hover {
transform: scale(1.05);
z-index: 0;
}

.products .box-container .box .image .icons {
position: absolute;
bottom: 0;
left: 0;
right: 0;
display: flex;
}

.products .box-container .box .image .icons a {
margin-left: 8rem;
margin-bottom: -3rem;
height: 4rem;
line-height: 6rem;
font-size: 1.25rem;
width: 50% background: black);
color: #000;
}

.products .box-container .box .content {
padding: 2rem;
text-align: center;
}

.products .box-container .box .content h3 {
font-size: 2rem;
color: #000;
}

.products .box-container .box .content price {
font-size: 1.5rem;
color: black;
font-weight: bolder;
padding-top: 1rem;
}

Код: Выделить всё

[url=1-Seite.html]fashion[/url]

[url=1-Seite.html]Home[/url]
[url=2-Seite.html]Shop[/url]
[url=#]Über uns[/url]



 latest  products 



[img]bb.hoodie.png[/img]

[url=#][/url]
[url=#]add to cart[/url]
[url=#][/url]



MEDIUM FIT B HOODIE
 1.225€ 




[img]bbjacke.png[/img]

[url=#][/url]
[url=#]add to cart[/url]
[url=#][/url]



RACING JACKET
 3.100€ 




[img]nfs.hose.png[/img]

[url=#][/url]
[url=#]add to cart[/url]
[url=#][/url]



HEAVY WASHED BOMBER
2.175€ 




[img]nfs.bomber.png[/img]

[url=#][/url]
[url=#]add to cart[/url]
[url=#][/url]



GREY INSIDE OUT BOMBER
 2.750€ 




[img]ro.coat.png[/img]

[url=#][/url]
[url=#]add to cart[/url]
[url=#][/url]



HOODED COAT GREY/BLACK 
 4.250€  




[img]ro.coat 2.png[/img]

[url=#][/url]
[url=#]add to cart[/url]
[url=#][/url]



HOODED COAT BLACK
 4.250€  





Подробнее здесь: https://stackoverflow.com/questions/782 ... n-i-fix-it
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»