Комментарии: Position: absolute и Opera(а также IE 8)

Автор: dimka

dimka — Thu, 03 Oct 2013 08:54:36 +0000

Сам блок я бы центрировал банально с помощью относительного позиционирования, если ширина фикса, то конкретными значениями в пикселях, если резина, то высчитал с помощью JS. Доты можно фиксировать сделав значения display:inlane каждому, а значения родителя text-align:center..

Автор: Falcon

Falcon — Wed, 02 Oct 2013 22:07:30 +0000

Я имел ввиду просто background #FFF. Перепутал.

Автор: almac

almac — Wed, 02 Oct 2013 22:04:15 +0000

Это не лучшее решение, потому что не кроссбраузерно:
https://caniuse.com/#search=background-image

Автор: almac

almac — Wed, 02 Oct 2013 22:01:21 +0000

P.S. на будущее — верстать лучше немного по другому: все должно быть просто и понятно, то есть минимальным количеством кода нужно обходиться. Для центровки применяется 3 способа:
1. text-align: center
2. margin: 0 auto
3. position: absolute/relative/fixed; left: 50%; margin-left: -50px (сдвигаем влево ровно наполовину от ширины блока, в данном случае за всю ширину блока возьмем 100px)

3ий способ — это костыль, который используется в крайних случаях

Автор: Falcon

Falcon — Wed, 02 Oct 2013 21:58:18 +0000

Да, background-image намного лучше решение. Всем спасибо. А про ширину если можно поподробнее.

Автор: parazitexe

parazitexe — Wed, 02 Oct 2013 21:48:47 +0000

убери вобще блок .slider-image
а бг повесь на .carousel-indicators
и падингами раздвинь
ну и заокругли css3
так и обертка белая на кнопках будет и тянуться он будет
+ у тебя там ширина не правильная на обртках самой галереи

Автор: almac

almac — Wed, 02 Oct 2013 21:26:09 +0000

P.S. после этого останется выравнять буллеты (точки для переключения слайдов), т.к. они неправильно отцентрованы

Автор: kukushka

kukushka — Wed, 02 Oct 2013 21:25:08 +0000

Вы бы лучше спросили у автора, зачем он в блок запихал картинку. А вы ему отвечаете, что эту картинку нужно центрировать. Остается только взяться за голову.

Автор: parazitexe

parazitexe — Wed, 02 Oct 2013 19:26:10 +0000

Елементарные вещи я знаю, И фору дам в верстке любому.
суть в том чтобы зделать правильно, а не напихать костылей и пытаться застайлить.
это не смушает в css?
.row {
margin-left: -20px;
}
Абсолютно бесполезное св-во для галереи
особенно сразу после него идет это
[class*=»span»] {
float: left;
margin-left: 20px;
min-height: 1px;
}
на .carousel нету ширины ( а должна быть )

но есть специалисты котрые все фискят
position: relative;

( я знаю про то что как оно позиционируеться и относительно чего)

Автор: AlexNGerman

AlexNGerman — Wed, 02 Oct 2013 19:14:09 +0000

Как раз в нём и проблема. Принципиально сдела через встроенную в Оперу проверку кода и придал хеадеру стиль

position:relative;

И вот эта овальная подложка для кружочков уехала ровно на 650 пикселей вправо, как и написано в стилях у автора.
Не знаю кто как изучал вёрстку, но элементарные вещи про абсолютное позиционирование нужно знать. Если не задать position:relative; у родительского блок, то отчёт позиции будет не от родительского блока, а от края рабочей области экрана, а не блока в котором находится слой который мы хотим спозиционировать.