Почему большой div, центрированный с помощью трюка «margin», вырезан с левой стороны

0

У меня очень странная проблема с центрированием div, я смог сузить эту скрипку. В основном у меня очень большой div (3000px), и я хочу сосредоточить его на странице. Я использовал старый хороший трюк с отрицательным пределом:

.my_div
{
    width:3000px;
    position:absolute;
    left:50%;
    margin-left:-1500px;
}

Я был более чем потрясен, обнаружив, что это сокращает большую часть div (проверено в Firefox 25 и Chrome 30), когда окно браузера меньше 3000 пикселей. Я, конечно, пропустил что-то очевидное, поскольку я использую этот трюк в течение нескольких лет и никогда не имел никаких проблем с ним...

EDIT: Чтобы уточнить, я не хочу, чтобы прокрутка была центрирована, я хочу, чтобы div был центрирован (в случае, если div меньше окна). Если div больше, чем прокрутка влево, это отлично подходит для меня. Мне просто не нужно вырезать div браузером. Я тестирую с 3000px, но фактический div на моей странице имеет размер 1100px, и проблема очень реальная там

  • 1
    Как вы ожидаете, что он будет центрирован, не отрезая невидимую часть?
  • 0
    @MightyPork Я хочу иметь возможность прокручивать влево, чтобы увидеть остальную часть страницы ...
Показать ещё 6 комментариев
Теги:

1 ответ

1
Лучший ответ

margin: 0 auto; должен центрировать div для вас.

Я обновил вашу скрипку, включив маржу: 0 auto; вместо левой: 50%; и т.п.

Я также добавил меньший div, который также использует margin: 0 auto; чтобы показать, как он будет работать с меньшим div.

Дайте мне знать, если это не то, что вы ищете, и я могу попытаться помочь вам дальше.

Поделиться
  • 0
    это работает, но у меня есть еще один вопрос - могу ли я переместить элемент немного по центру? Я имею в виду то, что работает как left:50%; width:100px; margin-left:-60px , перемещение элемента на 10px влево от его центрированного положения?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню