Я пытаюсь сделать это <div>
я должен сосредоточиться на странице, но когда я использую align=center
, некоторые из содержимого внутри div также выполняются. Есть ли способ предотвратить это?
Вы можете использовать CSS (у div также должна быть указана ширина, см. Комментарий @j08691):
div { margin: 0 auto; }
div
следует изменить на более конкретный селектор, например идентификатор вашего контейнера (#
обозначает идентификатор) или класс (.
обозначает класс).
Пример:
#myDivID {}
.myDivClass {}
Причина этого заключается в том, что механизм рендеринга всегда пытается оптимизировать и балансировать размер любых компонентов, указанных как auto
. Здесь margin: 0 auto
- это короткое замыкание:
margin-top: 0;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
Здесь браузер не применяет никаких полей в верхней и нижней div
, но когда он видит, что и левое, и правое поля установлено в auto
, оно пытается (и преуспевает), чтобы сделать их равными друг другу путем разделения оставшееся пространство. Это приводит к тому, что div
помещается в центр страницы.
используя чистый css:
#content {
width: 10% ;
margin-left: auto ;
margin-right: auto ;
left: 45%;
top : 50%;
}
или
div { margin: 0 auto; }
Будет ли это приемлемо?
См. Это, это должно исправить вашу проблему
HTML
<div id="outer">'
dsadkjahdkjasgud
dbsudbasjdhbasjkdh<br />
dbsudbasjdhbasjkdh<br />
<div id="innerCenter">
dbsudbasjdhbasjkdh<br />
dbsudbasjdhbasjkdh<br />
dbsudbasjdhbasjkdh<br />dbsudbasjdhbasjkdh<br />
</div>
</div>
CSS
#outer{
width : 500px;
background-color:green;
}
#innerCenter{
margin:0 auto;
width : 50%;
background-color:red;
}
** Примечание: вы можете изменить ширину в соответствии с вашим расположением
Сценарий: http://jsfiddle.net/aasthatuteja/zKstw/
#container
если вы не хотите центрировать все элементыDIV