Как горизонтально центрировать
?

Символьные переменные и константы могут быть «подстрочными» с использованием синтаксиса, аналогичного разделу массива.

a_character_variable = "taco"(1:1)

Подстрока символьной переменной также является переменной - она ​​может появляться с левой стороны оператора присваивания.

4049
задан 32 revs, 23 users 13% 30 October 2018 в 12:21
поделиться

5 ответов

Можно применить этот CSS к внутреннему <div>:

#inner {
  width: 50%;
  margin: 0 auto;
}

, Конечно, Вы не должны устанавливать width на 50%. Любая ширина меньше, чем содержание <div> будет работать. Эти margin: 0 auto то, что делает фактическое центрирование.

при предназначении для IE8 + могло бы быть лучше иметь это вместо этого:

#inner {
  display: table;
  margin: 0 auto;
}

Это сделает внутренний центр элемента горизонтально, и это работает, не устанавливая определенное width.

Рабочий пример здесь:

#inner {
  display: table;
  margin: 0 auto;
  border: 1px solid black;
}

#outer {
  border: 1px solid red;
  width:100%
}
<div id="outer">
  <div id="inner">Foo foo</div>
</div>
4486
ответ дан 12 revs, 8 users 28% 30 October 2018 в 12:21
поделиться

Это не может центрироваться, если Вы не дадите ему ширину, иначе это возьмет, по умолчанию целое горизонтальное пространство.

85
ответ дан gizmo 30 October 2018 в 12:21
поделиться

Установите ширину и установите поле слева и поле справа на авто . Однако это только для горизонтального . Если вы хотите обоих способов, вы просто сделаете это обоими способами. Не бойтесь экспериментировать; не похоже, что ты что-нибудь сломаешь.

86
ответ дан 17 December 2019 в 16:00
поделиться

Один из самого легкого пути...

<!DOCTYPE html> 
<html>
 <head>
    <style>
        #outer-div {
        width: 100%; 
        text-align: center;
        background-color: #000 
        }
        #inner-div {
        display: inline-block; 
        margin: 0 auto;
        padding: 3px;
        background-color: #888
        }
    </style>
 </head>
 <body>
    <div id ="outer-div" width="100%">
        <div id ="inner-div"> I am a easy horizontally centered div.</div>
    <div>
 </body>
</html>
3
ответ дан 17 December 2019 в 16:00
поделиться

если у Вас есть родитель некоторой высоты, говорят, тело {высота: 200 пкс} или как ниже имеют родителя div#outer с высотой 200 пкс, затем добавьте CSS как ниже

HTML:

<div id="outer">  
  <div id="centered">Foo foo</div>
</div>

CSS:

#outer{
  display: flex;
  width: 100%;
  height: 200px;
}
#centered {
  margin: auto;
}

затем дочернее содержание, скажите, что div#centered содержание будет вертикально или горизонтально середина, не используя CSS положения. Для удаления вертикально среднего поведения затем просто изменяют к ниже кода CSS:

#centered {
  margin: 0px auto;
}

Демонстрация: https://jsfiddle.net/jinny/p3x5jb81/5 /

0
ответ дан 17 December 2019 в 16:00
поделиться