我想创建一个从浏览器窗口顶部到底部水平居中的内容块的页面。我已经意识到表格不是设计布局的正确方式。从上到下的块不是问题所在：
<div style="position:absolute;top:0px;width:800px;height:100%;background-color: #fff;">
</div>
但是我不能使这个Div居中。我试过了
“页边距:自动”
但没有效果。这使Div中的文本居中，而不是Div本身在屏幕上居中。
浏览 2提问于2011-06-30得票数 0
回答已采纳
2回答
我有一个关于使用div#container居中页面的问题，通常容器代码是这样的：
div#container
{
margin-left: auto;
margin-right: auto;
width: 50em;
}
容器div标签包装了我想要在其中居中对齐的那部分代码。
例如，我们有2个对象A和B，_object A是绝对位置，B是相对位置
对象A和对象B都包装在容器内
问题:只有对象B(相对位置)居中对齐，对象A(绝对位置)不居中对齐
那么，如何将已经定位为绝对位置的东西居中呢？感谢您的解释
浏览 2提问于2009-06-15得票数 2
我有一个加载脚本的广告，它位于一个居中的div中。无论我做什么，ie6、ie7和ie8都不会将其居中，除非body
text-align:center;
现在div的css是这样设置的，它只能在chrome/firefox上工作：
#header{
width:730px;
margin:0px auto;
text-align:center;}
我试着用这样的链条来使用.getScript：
.css('text-align', 'center');
但是脚本不会从外部加载到chrome中，然后它会将整个页面的CSS设置为脚本的宽度。我
浏览 2提问于2011-07-12得票数 0
1回答
大家早上好。我在这个网站上看了看，并尝试了一些帖子中的建议，我把div放到了中心，但是div的左边缘居中，我希望div中的内容居中，然后div本身居中。
有没有可能在CSS中隐藏了一个空白处(有点乱)？
浏览 0提问于2012-05-16得票数 0
4回答
其他所有的div都是居中的，除了这个。好几个小时都快把我逼疯了。我终于崩溃了，发了邮件。附件是一张图片，你可以看到它不是居中的。
你可以看到它的实况。
div的图像未居中：
浏览 7提问于2016-07-06得票数 0
回答已采纳
2回答
我试图使2个图像和这些图像之间的文本顶部栏。但是我不能把文本居中。我正在为移动设备做这件事。
这是我的html
<img src="1.jpg" />
Company Name
<img src="2.jpg" />
我尝试了下面的代码，但不起作用。我无法将文本居中
<div style="float:left"><img src="1.jpg" /></div>
<div>Company Name</div>
<div style="
浏览 1提问于2013-06-12得票数 0
回答已采纳
有人知道为什么text-align: center和text-align:-webkit-center有区别吗？例如，如果您有：
<section>
<h1>Title<h1>
<div class="image"></div>
</section>
// CSS与文本对齐:居中；
section{
text-align: center;
}
这将仅使文本居中
// CSS with text-align：-webkit-center
section{
text-align: -webkit-ce
浏览 0提问于2016-02-01得票数 22
3回答
我需要有一个div，它的内容总是相对于屏幕居中，但我也有其他的div在我想要居中的左侧。如果我只是将" center“div的内容居中，它将相对于div宽度居中，而不是屏幕。
我尝试过的
我想要的是这样的东西..。
| true center |
|left div| centered D |
|longer left div| center
浏览 5提问于2013-06-11得票数 3
我希望将页面正文中的所有元素居中，而不将居中格式应用于段落。例如，我希望我的段落左对齐，但作为一个整体，在网页窗口居中。
我试着去做
<body>
<div align="center">
<p></p>
<img>
</div>
</body>
但是，虽然这会使正文中的所有元素在页面上居中，但它也会强制段落内居中对齐。
浏览 3提问于2011-12-27得票数 0
4回答
我有一个div，我想让它居中。这个很好用：.div{ position: relative; width: 300px; margin: 0 auto;}。问题是，我需要使用jQuery $('div').height()获得div的高度，但是，这将返回0，但是如果我将float: left添加到div，那么jQuery可以工作，但是div不再居中。
我能做什么?
谢谢
浏览 0提问于2012-03-17得票数 0
我有一个问题，居中的div与文本在它的垂直，同时保持一切流动性。文本div的旁边有照片，可以根据浏览器大小改变容器的高度。当部分缩小时，我需要文本在容器中居中。任何建议都会很棒！
我需要帮助的部分设置如下，info中的文本需要垂直居中。
<section class="section">
<div class="row">
<div class="col-md-7 info-outer">
<div class="info">
浏览 23提问于2017-06-28得票数 0
4回答
我有一些文本在我的html网站上使用div标签，所以我可以居中的文本，但它不会居中。
这是我放入HTML中的内容
<div id="info">
Welcome
</div>
这是我放在CSS中的内容
#info {
color: #0F0;
font-size: 20px;
text-align: center;
}
我已经使用了正确的css代码来居中文本，但由于某些原因，它不会居中。有谁有什么想法吗？
浏览 42提问于2017-02-12得票数 1
1回答
我在一个包含待售产品的页面上有以下div：
容器div。屏幕居中，宽度为750px。图像(450px)漂浮在左侧的Div。文本(允许文本溢出的流体宽度)向左浮动的Div。
我希望div在容器中居中，但不能为文本div指定像素宽度，因为一些页面比其他页面有更多的文本。
做这件事最好的方法是什么？
谢谢，加里
浏览 2提问于2011-08-11得票数 0
2回答
我试图在我的页面中居中一个div，但是我有一个非常特殊的布局，它不能让我用常规的页边距居中:汽车属性。我所拥有的，基本上是这样的：
HTML：
<div id="container">
<div id="sidebar">
some text
</div>
</div id="content">
some text
</div>
</div>
CSS：
#container{
margin: 0 auto
浏览 2提问于2010-10-20得票数 1
回答已采纳
我需要将文本居中。我使用了文本居中对齐，但下一行居中。我需要它与顶部的线对齐。
<div class="box">
<div class="text">Some text.Some text.Some text.Some text.Some text.Some text.Some text.
Some text.Some text.Some text.Some text.Some text.</div>
</div>
如何在下一行不相对于顶行居中的情况下将文本块居中？
浏览 0提问于2013-05-15得票数 1
回答已采纳
1回答
我使用的是Twitter Bootstrap框架，导航不是居中的。这是我的代码：
<div id="subnav" align="center">
<div class="container">
<a href="index.php">Startseite</a>
<a href="youdesk.php">YouDesk</a>
<a href=&#
浏览 0提问于2013-01-14得票数 0
我尝试在Bootstrap列中垂直(和水平)居中一个div (高度和宽度未知)。我可以通过将text-align设置为center来水平居中div。然而，我正在努力使div垂直居中。下面是我的代码片段：
<div class="row">
<div class="col-md-8 col-md-offset-2 col-xs-12">
<div style="text-align: center"> <!--this works-->
<p>
浏览 0提问于2014-05-27得票数 2
2回答
我用一个div居中...
jQuery.fn.center = function () {
this.css("position","absolute");
this.css("top", (($(window).height() - this.outerHeight()) / 2) +
$(window).scrollTop() + "px");
this.css("left", (($(window
浏览 6提问于2012-02-26得票数 1
1回答
我正在设计一个网站，我试图按照本教程https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_center-vertical在div中垂直居中元素。 从技术上讲，内容确实居中。问题是:内容div比内容本身更高，所以实际上它不是完全居中的，这给移动屏幕带来了问题。 不幸的是，不知道它是如何发生的，也不知道如何解决它。 Html部分： <div class="banner-item-content">
<img src="https://alto.7180.eu/modules/custo
浏览 23提问于2019-09-05得票数 0
回答已采纳
7回答
我有以下HTML：
<div class="outer">
<div class="inner rotate">Centered?</div>
</div>
div.outer是一个窄的垂直条带。div.inner旋转90度。我想要文本“居中？”在其容器div中居中显示。我事先不知道这两个div的大小。
这很接近：。您可以从jsfiddle中看到，在应用transform: rotate(-90deg)样式之前，文本垂直居中，但在应用之后，文本在垂直方向居中。当div.outer很短时，这一点尤其明显。
是
浏览 0提问于2013-02-28得票数 84
回答已采纳
2回答
我正在尝试设计以下页面的样式：
我遇到的问题是，我真的需要在带有页眉的页面上将div左侧居中，div右侧居中。有人可以建议一个样式或属性，只需将标题下的整个部分移到页面的中间？
谢谢!
浏览 4提问于2011-09-29得票数 0
我有一个div，它需要在整个页面上拉伸，但实际内容应该只有z像素宽，并居中。也就是说，文本不居中，但内容所在的区域- div的内部-居中。
合乎逻辑的方法是这样做：
<div>
<!--I stretch across the entire page!-->
<div>
<!--I am z pixels wide, and my margins are auto. Content goes here.-->
</div>
</div>
唯一的问题是，它看起来真的很div-itis y。这是使用盒子模型应该能够实现的
浏览 0提问于2011-10-02得票数 1
回答已采纳
1回答
我使用React，并使用display: table和display: table-cell将元素水平和垂直居中，并适当居中css。
在它里面我有一些内容，当我用javascript将内容添加到元素中时，整个元素正确地重新居中，但元素从它们的初始位置跳到它们的下一个位置。
我想在适当的地方让它动起来，可以吗？
从这个开始：
<div table>
<div table-cell>
<div>First Content</div>
</div>
</div>
要这样做：
<div table>
浏览 1提问于2017-02-13得票数 0
5回答
我正在尝试让我的显示在div的中间。我看过一些建议，比如，但它是基于整个窗口的居中，而不是在div中。
当toastr对表单上的元素一无所知时，是否可以将toast通知放在表单元素的中心？
我最近的一次尝试是在页面中粗略地居中，但我想将它放在某个div中。这有可能吗？如果是这样的话，是怎么做的？
这是我的居中尝试：
.toast-center {
top: 50%;
left: 40%;
}
浏览 0提问于2013-04-06得票数 5
我正在尝试使用bootstrap将Google Map API居中，但它不起作用。请参阅有关该问题的图像。文本居中，而不是地图居中。
我试过在周围元素中放置“text-center”的每一种方法，并将map放在“col 6”中，但都不起作用。我确信我错过了一些愚蠢的东西。任何帮助都是非常感谢的。
<div class="container">
<h1 class="text-center">My Map</h1>
<div class="text-center" id="map&#
浏览 0提问于2019-07-17得票数 1
2回答
为了根据内容改变模态的宽度，我试图垂直地对一个具有modal-dialog的display: inline-block进行居中。我使用text-align: center将模式水平地居中于modal上，但这并不是垂直地将其居中。我该如何垂直地对着它呢？
.modal {
text-align: center;
}
.modal-dialog {
max-width: 100%;
width: auto !important;
display: inline-block;
}
<div class="modal fade modal-xl
浏览 4提问于2022-07-27得票数 -1
4回答
不知道该如何命名问题。我有一个这样的html结构：
<div id="nav"></div>
<div id="wrapper">
<div id="content">
</div>
</div>
使用像这样的css：
#nav {
width: 200px;
height: 50px;
margin: 0 0 0 -100px;
position: fixed;
left: 50%;
backgroun
浏览 0提问于2012-03-23得票数 6
3回答
我试图在两个浮动div之间居中显示一个文本。问题是，文本不能正确地居中，即使我遵循了我能在网上找到的每一步。下面是我用来实现目标的代码：
.EditingApp-head {
background-color: #222;
width: 100%;
overflow: auto;
}
.EditingApp-head-logo {
float: left;
overflow: auto;
width: 10%;
}
.EditingApp-head-logo-image {
height: 40px;
margin-top: 4px;
float:
浏览 0提问于2017-03-08得票数 0
<div>
<span style= "background: red; text-align: center;">
There is an error
</span>
</div>
文本居中对齐不起作用。我想要的文字居中与背景。
浏览 1提问于2019-02-11得票数 1
1回答
如何在btn-toolbar div内水平地居中引导3 col-lg按钮？
<div class="col-lg-6 col-sm-3 noleftpad">
<div class="well topnestedbut">
<div class="btn-toolbar nested-top">
<button type="button" class="btn btn-defaul
浏览 7提问于2014-04-11得票数 0
回答已采纳
2回答
div
{
margin:90px auto;
}
这段代码在chrome中将div居中，上边距为90px，但结果在所有其他浏览器中都不同。
有没有一种通用的方法来使div居中并同时具有上边距？
浏览 0提问于2010-06-10得票数 0
回答已采纳
我有一个标题div，在页面顶部的固定位置。
在它里面有一些向左浮动的div和一些向右浮动的div，都有链接。我有另一个div，我希望它在页面上居中，垂直放置在它们之间。
图表：
DivA DivB PageCenteredDiv DivC DivD DivE
我让页面居中的div工作得很好：
width: 100%;
text-align: center;
position: fixed;
top: 0;
left: 0;
但是，无论我如何处理任何div上的z-index，浮动div中的链接都位于居中div的下方，无法单击。
有
浏览 0提问于2011-11-11得票数 1
回答已采纳
2回答
我有一个全宽度的包装纸。在它里面，还有另一个div集，名为display: table。
我已经将包装器设置为text-align: center，但是表div没有居中。为什么会这样呢？为了使display: table div水平地在包装器中居中，我在这里遗漏了什么？
<div class="wrapper">
<div class="tb">
<div class="tb-cell">1</div>
<div class="tb-cell&
浏览 5提问于2014-09-09得票数 0
回答已采纳
这是以下代码
<nav class="navbar navbar-fixed-bottom top-main-navbar">
<div class="container">
<div class="navbar-header">
<div class="navbar-brand">
浏览 0提问于2015-04-04得票数 1
2回答
我用它来居中我的主div，它包含了所有东西。
#main {
margin-left: 10%;
margin-right: 10%;
width: 100%;
height: 100%;
}
另外，我也不认为main div居中很好。
非常感谢你的帮助！
浏览 0提问于2013-01-07得票数 1
回答已采纳
1回答
我正在使用，我试图创建一个包含三个span3 div的居中行的网格。
我试图通过将三个span3s封装在一个居中的span9中来实现这一点，但这似乎行不通。
我的问题是，div没有正确地居中，而且由于我是HTML和CSS新手，我真的需要一些帮助。谢谢!
HTML
<div class="row">
<div class="span9 center">
<div class="span3">
<p>THUMBNAIL1</p>
<
浏览 2提问于2013-08-31得票数 1
回答已采纳
如何使.container居中，使小屏幕上的项目位于左侧，.container居中。
我的示例
.container {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.item {
width: 370px;
height: 250px;
background-color: #333;
margin: 0 30px 30px 0;
}
<div class="container">
<div class="item"><
浏览 3提问于2020-03-12得票数 0
我在一个组项目的页面上居中了一个div，虽然div本身是居中的，但网站内容是居中的，并考虑到滚动条。我的意思是网页内容居中，这样屏幕的宽度就不需要滚动条的宽度了。因此，如果显示器最初的宽度是100px，那么它的读数就是100(滚动条宽度) px宽。不幸的是，这导致我的固定位置div的滚动条宽度偏离站点的其余部分，它看起来相当时髦。有什么办法解决这个问题吗？不能使用jquery，可以潜在地使用一点JS。
这是我的网站的链接，这样你就可以看到我在说什么。
浏览 3提问于2013-05-15得票数 0
我使用了两个div，一个父级和一个子级。父元素的宽度为100%，其内容与文本居中对齐。
子div的宽度应该为零(或接近它的值)，并使用其内容自动扩展其宽度，同时仍在父div中居中。示例：
+------------ PARENT DIV ------------+
| |
| ..some content.. |
| |
| +--CHILD DIV--+ |
|
浏览 0提问于2013-04-25得票数 7
回答已采纳
1回答
这可能看起来像通常的如何居中一个浮动问题，但我需要将一个浮动div居中的原因是因为其他div容器也有一个浮动属性。我已经设置了一个高度自动来确定高度依赖于包装器div内的对象，在包装器div内有2个浮动div使其并排。然而，如果我没有在包装器上指定一个浮动，包装器div将只显示一行直线(不包装任何东西)
div.wrapper{
width: 1000px;
height: auto;
margin-top: 30px;
float: left;
border:1px solid gray;
}
div.leftcontainer{
width: 200px;
height: auto;
m
浏览 0提问于2012-01-16得票数 0
我试图在div中创建div。但是我在将div居中时遇到了问题。我跟踪了
使用上面问题中建议的方法，DIV是水平居中，而不是垂直居中。
目前我使用的是保证金-顶部: 20%。请建议其他垂直居中的方法。另一个问题是，我们可以用百分比表示不透明度吗？
浏览 0提问于2010-09-26得票数 2
1回答
我希望水平对齐由另外两个div组成的div：
一个从左边，它将包含一个图像。
从右边看，div将包含文本，与左对齐。
对齐将相对于容器，而居中的div应该扩展到最大宽度(而不是整个容器的宽度)。
描述了我试图使用表布局进行的操作。
这是HTML
<div class="container">
<div class="centered">
<div class="left">
left text
</div>
<div class="
浏览 3提问于2016-10-10得票数 0
我尝试使用一个位于菜单下面的div，拉伸它直到到达页脚(以防没有足够的内容)，然后居中。我可以使用绝对定位来拉伸它，但它不会居中；我可以将它居中，但它不会拉伸。代码看起来像这样：
HTML
<div id="container">
<div id="header"></div>
<div id="content"></div>
<div id="footer"></div>
</div>
CSS
html, bo
浏览 4提问于2014-04-29得票数 1
2回答
我有一个容器，它的高度为100vh，以便在整个屏幕上伸展。里面有一个h1和一个div，即两个容器。现在，div中的内容是我想要在页面上居中对齐的内容，但由于我的h1，我不能。 所以基本上设置是： HTML： <div class="main-container">
<h1>This is a headline</h1>
<div class="content-container">
<p>Different stuff in here</p>
&l
浏览 18提问于2020-10-21得票数 1
回答已采纳
要使一个HTML元素居中，我可以使用CSS left: 50%;。但是，这会使元素相对于整个窗口居中。
我有一个元素，它是一个<div>元素的子元素，我希望该子元素相对于这个父<div>居中，而不是整个窗口。
我不希望容器<div>的所有内容都居中，只有一个特定的子级。
浏览 178提问于2011-07-25得票数 204
回答已采纳
2回答
我很难在bootstrap 4列中对齐一些图像。我已经尝试使用CSS属性text-align: center，这将使图像水平居中。我的列占据了大量的视图端口，所以我还需要图像垂直居中。 下面是我的react组件返回的内容。class="img13“是我想要的中心。 <div id="border">
<div class="container">
<div class="row tower">
<div class="
浏览 65提问于2020-08-18得票数 1
回答已采纳
就像标题中所说的那样，我想在屏幕中间对一些框(比如说登录框)进行居中。在此框下，我想显示其他几个框(附加信息/免责声明等)。
编辑:更准确地说:居中登录框，必须是垂直和水平居中，并停留在那里。附加框应该出现在居中的登录框下面。
做这件事最简单的方法是什么？
HTML：
<div id="centeredBox">
I am centered and have some undefined size (cause I could display some image
</div>
<div id="underCenteredBox&#
浏览 5提问于2015-11-12得票数 1
回答已采纳
我想居中放置一个div，所以我编写了<div style="padding-left: 50%;"> test </div>。在我将浏览器调整到非常小的大小之前，文本居中显示得很好。(约300像素宽度)。然后它开始显示一个水平滚动条。
为什么浏览器(Chrome12、Opera11.50、Firefox5)要实现这种行为？在我看来，这是不正确的。没有需要滚动条的内容。我如何禁用它，或者我应该做什么来居中我的内容？
浏览 1提问于2011-07-04得票数 0
回答已采纳
2回答
想用CSS垂直居中div。不想要表或Javascript，但只有纯CSS。找到了一些解决方案，但都缺少对Internet Explorer 6的支持。
<body>
<div>Div to be aligned vertically</div>
</body>
如何在所有主流浏览器（包括Internet Explorer 6）中垂直居中div？
浏览 572提问于2017-12-06
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
