我想要在页面上居中显示未知宽度/高度的图像，同时确保它在大于页面时缩小(即使用max-width/max-height)。
我尝试使用display:table-cell方法，但是在Firefox中，对于用display:table-cell声明的元素中的所有元素，max-width都被忽略。有没有办法在不使用display:table-cell的情况下使可变高度元素垂直居中？
我可以改个记号。JavaScript是可以接受的，但我不能使用JQuery (或任何其他JS库)。
浏览 1提问于2011-06-09得票数 2
回答已采纳
3回答
我想居中放置一个表格，但尽管它在技术上居中，但td内容的不同长度使表格在右侧有一个空白空间。
.wrap {
background: pink;
padding: 0 50px;
}
table {
margin: 0 auto;
text-align: center;
width: 100%;
tr {
td {
padding: 10px;
text-align: left;
}
}
}
<div class="wrap">
<table>
<tbody>
浏览 1提问于2017-09-15得票数 2
3回答
我希望只将表头居中，而不是表中特定列的正文。例如：
\begin{table}[!t]
\centering
\caption{
\bf{My table}}
\begin{tabular}{l|c|}
...
\end{tabular}
\end{table}
将生成一个左对齐列和一个居中对齐列。我希望所有的标题都居中，但表格的主体实际上是左对齐的。如果每列中的条目都很宽，那么让内容左对齐或右对齐而不使标题居中看起来很奇怪(这会在标题中留下许多空格)。
其次，在LaTeX中，有没有办法强制表格显示在自己的页面上？或任何与此相关的数字？
浏览 2提问于2010-02-05得票数 34
回答已采纳
下面的表单(我已经删除了所有其他行)在它的父div中很好地居中显示。问题是，当我开始编辑字段时，如果出现验证错误，当验证消息出现在编辑器的右侧时，整个表单将重新居中以显示新的内容宽度。非常烦人。然后，我尝试将所有的ValidationFors移到一个单独的右对齐的div中。不过，问题是一样的。只要在右对齐的div中出现错误，中心表单就会移位。
我如何：
1)让窗体居中显示，但在初始加载后停止自动居中？将验证消息显示在编辑器的右侧是很好的，但我不希望屏幕布局不断变化。
2)有没有办法预先分配一些隐藏的左右宽度，以便主要表单元素(标签和编辑器)居中，并且验证消息不会进入居中内容？
<tab
浏览 0提问于2015-05-18得票数 0
3回答
我这里有一个jsfiddle -
我需要一个覆盖的页面和文本的全部宽度和高度是死心。
我可以用display: table做到这一点；但我需要html和body上的height: 100%；。
这在实际代码中造成了问题。
是否有可能有100%覆盖与居中的文本而不显示:表；
我这里有一个例子--
我可以水平居中，但不能垂直居中。
在第二个例子中是否可以将文本水平居中。
html, body{
height: 100%;
}
.block{
background: rgba(230, 97
浏览 1提问于2015-04-24得票数 0
1回答
我想在html/css (没有js)中制作一个从数据库中带水平滚动条的图片块，这样无论它们的高度如何，它们都会居中。
我找到的将未知高度的图片居中的唯一解决方案是使用display: table或display: flex。但我发现制作水平滚动条的唯一解决方案是使用display: block。有没有办法同时完成这两项任务？
编辑：
就像这张照片上的一样。我的意思是图片应该居中，不同的高度：
浏览 6提问于2013-12-24得票数 0
我有一个元素，它根据某些条件显示或隐藏。我使用jQuery fadeIn()和fadeOut()动画来隐藏或显示元素。
我的问题是，在fadeOut/fadeIn序列之后，元素的位置突然改变了。但是，我在计算的样式规则中找不到任何差异。既不是元素本身，也不是嵌入的div标签。序列之后发生了什么变化？
我做了一个简短的测试用例：
注意桌子下面的三角形指向下方，它是居中的。当你点击两次“切换”按钮时，就会运行fadeOut/fadeIn序列。之后，元素不再居中，而是硬定位在左侧。
下面是测试用例的代码：
HTML：
<button id='toggle'>Toggle&
浏览 0提问于2012-07-15得票数 0
回答已采纳
1回答
我正在使用并阅读以下链接：
关于如何使用CSS使表格居中，因为align已被弃用。然而，它们都不起作用，3个链接中建议的居中表格代码如下所示：
.centered-table {
margin-left: auto;
margin-right: auto%;
}
我的代码：
CSS：
.maintbl {
margin-left: auto;
margin-right: auto%;
}
HTML：
<table class="maintbl" id="tblMain">
<tbody>
浏览 5提问于2016-10-29得票数 1
1回答
将中心菜单与其内容对齐
、、、、
我试着用方框大小在菜单的div中水平居中显示文本。
如下所示：
我的问题是，当我试图放置position: absolute子菜单时，主文本不考虑子菜单在左侧的大小和位置。
以下是中的代码。
<div id="menu">
<div>
<table>
<tr>
<td>Nosotros</td>
</tr>
<tr>
<td>
<a&g
浏览 2提问于2013-11-27得票数 0
3回答
我对html知之甚少，对css几乎一无所知。我想知道在单元格内将左对齐的文本更改为居中对齐的最简单方法。stackoverflow上的某个人用以下代码帮助我解决了如何在wordpress页面上居中放置表格的问题。
<div style="text-align: center;">
<table style="margin: 0px auto;" border="0">
<table border="0">
<tbody>
浏览 1提问于2011-10-05得票数 2
回答已采纳
我正在制作一个sharepoint 2010页面，下面的代码成功地将表格居中放置在页面中间，但是当我从代码中删除-webkit-时，它不再居中。为什么"text-align: center;“不起作用？另一件奇怪的事情是-webkit-只在Chrome中使居中工作。在所有其他浏览器中将该表居中显示似乎是不可能的。
<style>
.s4-wpcell-plain{
text-align: -webkit-center;
}
</style>
<table style="width:100%" cellpadding="0
浏览 0提问于2017-06-27得票数 2
4回答
<table class="table table-striped table-hover table-responsive">
<thead>
<th scope="col">column1</th>
<th scope="col">column2</th>
<th scope="col">column3</th>
</thead>
<tbody>
<tr&g
浏览 1提问于2018-05-22得票数 3
回答已采纳
所以也许这只是我将身体居中的方式，因为我在html中将它显示为居中的表格。
html {
display: table;
margin: auto;
}
body {
width:100%;
display: table-cell;
vertical-align: middle;
}
#background{
width:100%;
height:100%;
position:fixed;
background-image:url('image.jpg');
background-repeat
浏览 2提问于2013-03-09得票数 0
回答已采纳
4回答
在我的场景中，HTML页面的宽度是有限的(使用max-width)，这样页面上的文本就不会变得太宽(而且很难阅读)。
我还在表(居中)中显示了一些数据，只要表适合父容器，这些数据就可以正常工作。但是，有时一个表比父元素更宽，此时它不再被居中，而是对齐到左边。
是否有一种方法可以使表居中，这样即使它溢出其父表也能保持居中状态？
考虑到我的HTML看起来像这样，完成这个任务需要什么CSS？
<div class=content>
<p>Lorem ipsum...</p>
<table>
...
</table>
浏览 3提问于2012-08-30得票数 2
回答已采纳
3回答
我有一个问题，我相信我已经把范围缩小到DataTables响应式插件了。
所以在Bootstrap中，我有两列，每列6个。左边是一个DataTable，右边是一个div框。当浏览器缩小范围时，这两个项目应该拆分成各自的行，堆叠在彼此的顶部，项目居中。但是，在该断点处，DataTable不会调整大小以使其位于屏幕的中心。它一直在左边。如果您以该宽度刷新页面，它将自动居中，只是不会响应断点。
如果你反其道而行之，从手机大小的页面开始，并向外展开窗口，DataTable将在左侧的细列中保持压缩状态。
如果我去掉响应式插件，它会在断点处自动居中。然而，我想使用这个插件来帮助处理手机大小的桌子。
下面是
浏览 0提问于2015-08-22得票数 4
1回答
我的桌子有些问题。我创建了两个表，一个在另一个下面，我想居中元素，但我对他的部分有问题。我的元素没有垂直对齐，也没有像你在下面的图片中看到的那样真正居中。 ? 代码如下： <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/rea
浏览 14提问于2021-07-08得票数 2
回答已采纳
3回答
请看
我可以只使用CSS来显示箭头，但我永远不能在TD中居中显示文本(在本例中为"abc")。执行“文本对齐:居中”似乎不可用..有人能推荐我吗？(没问题，位置不是完全居中)
<html>
<body>
<table>
<tr>
<td class="arrow_td">
<span class="name">abc</span>
<div class="arrow"></div>
浏览 1提问于2012-02-12得票数 3
在Antenna House 5.3中，我还没有发现如何创建一个旋转90度的表格单元格“左对齐”(在页面底部垂直对齐)和“垂直居中”(在页面上水平居中)。我已经尝试了我认为可以的所有文本对齐显示对齐组合，但结果仍然是“顶部对齐”(垂直在底部，水平在左侧)。 您知道如何在旋转的表格单元格中使文本左对齐和垂直居中吗？下面是一个单元格的示例： <fo:table-cell display-align="after">
<fo:block-container reference-orientation="90" display-align=
浏览 27提问于2019-05-31得票数 0
回答已采纳
由于某些原因，表格中的文本仍然没有居中。为什么？如何在表格中居中显示文本？
说得很清楚:例如，我希望"Lorem“坐在四个"1”的中间。
@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
table,
thead,
tr,
tbody,
th,
td {
text-align: center;
}
<table class="table">
<thead>
<tr>
<
浏览 0提问于2012-07-27得票数 126
回答已采纳
1回答
我有一个超文本标记语言的表格(样式与CSS)是在一个JLabel中显示。我希望单元格的内容(一行短文本)既水平居中又垂直居中。水平居中很容易，但我似乎不能垂直居中文本。我已经使用middle和center参数尝试了vertical-align:和valign:。我已经研究了几个技巧，但似乎没有一个是可行的，而且我尝试的那些也不起作用。
我现在所拥有的：
内联(在<style>标签中) CSS：
table.outer {
background:#F0F0F0;
border-collapse:collapse;
border:none;
}
td.oute
浏览 0提问于2011-07-22得票数 6
回答已采纳
1回答
这是我的问题，我读了一个DB，并通过渲染器显示数据。显示的数据必须居中，bgcolor必须根据单元格的值进行更改。
下面是渲染器。第一个table.getColumnModel()显示居中值，第二个调用客户渲染器更改颜色。如果删除第二个调用的注释，就会得到bgcolor，而不是居中值，反之亦然。
for (int row = 0; row < table.getColumnCount(); row++) {
DefaultTableCellRenderer centerRenderer = new DefaultTableCellRenderer();
centerRen
浏览 1提问于2020-08-06得票数 0
回答已采纳
1回答
这些CSS属性使任意大小的图像在任意大小的容器中居中显示：
display:table-cell;
text-align:center;
vertical-align:middle;
这是一个完美的流体图像居中，然而，表格单元格属性在底部给了我不想要的空白。如何避免呢？请看以下内容：
浏览 0提问于2012-05-08得票数 1
回答已采纳
我正在尝试解决如何在表格行中居中的输入框下方对齐文本，而不将文本框向上推。
下面是我的表格：
<table border="1">
<tr>
<th>One</th>
<th colspan="2">Info</th>
</tr>
<tr>
<td rowspan="4">
<input type="text" value=
浏览 1提问于2015-07-31得票数 1
1回答
我正在尝试构建一个包含多个单元格的单行css表，这些单元格的文本在单元格中垂直居中。基本上，我试图用css模仿的表行为是这样的：
<table width="100%" height="54" border="0" bgcolor="red">
<tr>
<td width="20%">text</td>
<td width="20%">text</td>
<td width="20%&#
浏览 0提问于2010-09-17得票数 0
如何克服此弹出错误"DataTables warning: table id=DataTables_Table_0 -无法重新初始化DataTable。有关此错误的详细信息，请参阅http://datatables.net/tn/3“ 另外，我想把桌子居中对齐，我该怎么做？ 我已经尝试了datatables网站上给出的方法，但它不能解决任何问题，如果我忽略这个错误会发生什么？ <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
浏览 14提问于2019-05-03得票数 0
在我的Html中有一个头、两个按钮和两个表。当网页第一次启动时，将显示与“第一”按钮相关的表。不显示与第二个按钮关联的表。
单击“第二个”按钮时，将显示与第二个按钮关联的表，而不显示第一个表。
代码在IE11中运行良好，表在IE11中居中，但该表没有在chrome/firefox中居中。
HTML：
<!DOCTYPE html>
<html>
<head>
<title>All Stock Data</title>
<link rel="stylesheet" href="stock
浏览 2提问于2016-05-23得票数 0
回答已采纳
1回答
我对此进行了搜索，但没有找到解决方案。我有一个带文本的锚。
锚的高度和宽度是由JS设置的DOM加载，我需要在锚内的文本垂直和水平居中。
遵循了许多关于居中元素的教程。它们都不起作用。
这是我的html
<a href="#" class="wpsc_category_grid_item" title="Category1">
<span>Category1</span>
</a>
和我的CSS
.wpsc_category_grid_item {
background: #000;
浏览 0提问于2012-08-28得票数 1
回答已采纳
我在PowerPoint中创建了一个表，我希望在每个单元格中水平地对文本进行居中。我用了MsoHorizontalAnchor.msoAnchorCenter.
如果文本是短的，并且是以单元线表示的，那么它可以很好地工作，但是如果文本是长的，它会显示在超过1行的位置上，并且不会居中。守则：
myShape.Table.Cell(1, 1).Shape.TextFrame.TextRange.Text = "shortOK";
myShape.Table.Cell(1, 2).Shape.TextFrame.TextRange.Text = "Long text is n
浏览 0提问于2018-05-08得票数 2
我使用Virtual Composer并插入一个原始的js元素。然后我将代码粘贴到元素中--这一切都很好用！
但我希望输出脚本在我的页面居中。现在它会自动向左对齐。
该脚本将显示一个包含4个项目的滚动横幅。如果我编辑"raw js“元素，并把脚本放在中间，横幅本身就不会显示…但如果我将鼠标移到它们所在的位置，我可以看到左/右导航箭头-这些箭头居中-但如果没有横幅本身，效果就不是很好;)
有什么建议吗？
谢谢!抢夺
浏览 0提问于2015-11-12得票数 0
我有一个具有多个标题的html表，但是我有一些场景，我希望显示一行，一些文本在中间居中。这是一种尝试：
<table border="1">
<tr>
<th>Name</th>
<th>Telephone</th>
<th>Telephone</th>
</tr>
<tr><td>No values</td></tr>
</table>
我想要的是没有值的单元格上的整行和文本居中。
浏览 1提问于2013-05-02得票数 0
我想要显示一个图像居中窗口(水平和垂直)。如果图像太大，我想缩小到合适的尺寸(没有滚动条)。
这是一个实时的 -试着调整窗口的大小。图像缩放以适合，但不是垂直居中。
我正在尝试使用CSS table/table-cell，但这破坏了图像上的max-height设置。如果取消对table/table-cell的注释，图像将延伸到窗口底部之外。
两者都有可能吗？我发现了类似的问题，但不是这个确切的设置。
浏览 1提问于2014-09-07得票数 0
2回答
<ul>
<li><a href="news.asp">Hello</a></li>
<li><a href="contact.asp">Hello</a></li>
<li><a href="about.asp">Hello</a></li>
</ul>
ul {
display: table;
table-
浏览 1提问于2013-05-06得票数 1
回答已采纳
我正在解决Firefox中的一个问题(我使用的是40.0.3)，其中使用-moz-column-count和display: table会使列表显示为一列。这是我的例子和一个
div {
-webkit-column-count: 2; /* Chrome, Safari, Opera */
-moz-column-count: 2; /* Firefox */
column-count: 2;
}
ul {
display: table;
margin: 0 auto;
}
<div>
<ul>
<li>abcd<
浏览 3提问于2015-09-25得票数 18
回答已采纳
1回答
在带有vh的div中垂直居中
、、、、
我目前正在尝试将一个尺寸设置为vh的div中的图像居中。我尝试使用display:table-cell;方法，它将图像居中，但开始扰乱其他元素的大众。我想知道是否有另一种更简单的方法在div中垂直居中显示为vh。我知道这可能有点令人困惑，所以希望我下面的代码能有所帮助！
Html：
<div class="graphic" style="background-color:#ff837b">
<img src="images/WAInduo-02.svg" style="width: 100%; height: 5
浏览 0提问于2014-07-26得票数 13
回答已采纳
4回答
HTML表格问题
、、
我有一个HTML表格的问题，我想更好地了解它。
假设我有一个3行的HTML
<table>
<tr>
<td style="text-align:right;">A1</td>
<td>A2</td>
</tr>
<tr>
<td style="text-align:right;">B1</td>
<td>B2</td>
&l
浏览 0提问于2008-12-12得票数 2
这是一个类似的帖子：，但我并没有强迫内容消失，而是试图强迫实际的行消失。我使用css display: tables在div中垂直居中显示内容
所以我有一个网站，它的一般设置如下：
-------------------------------------------------
|Row1 |
-------------------------------------------------
|Row2 |
---------
浏览 2提问于2013-03-06得票数 0
1回答
我试图避免使用表布局来完成特定的布局。我知道这是一个草率的程序，所以我要重新做。我似乎不能用div标记重新创建这样的东西：
<table border=10 cellpadding=10 width="90%">
<tr>
<td align="center" width="143">
<img src="http://blah.com/images/133widepixelimage.jpg">
</td>
浏览 1提问于2015-09-20得票数 0
回答已采纳
1回答
我用display:table-cell和vertical-align: middle将文本居中于旋转木马项目中。它工作得很好，但是当幻灯片改变里面的文本时，它会首先显示在顶部，然后才会居中。
这是我的代码-
如何进一步进行？
浏览 5提问于2016-10-04得票数 0
我正在使用Leaflet.js，我想要一些方法来居中地图在我有的标记，以便所有都在用户的视图中，当页面启动。如果所有的标记都聚集在一个很小的区域中，我希望地图缩小到仍然显示所有标记的级别。
我知道谷歌地图有自动居中功能，但我该怎么用Leaflet.js呢？
浏览 1提问于2013-06-24得票数 56
回答已采纳
3回答
我有一张像这样的桌子
<form >
<table>
<tr>
<td>Name :</td> <td><input type="text" name="name"></td><br>
</tr>
<tr>
<td>Password :</td> <
浏览 0提问于2015-11-28得票数 1
2回答
链接垂直对齐，高度100%
、、、、
如何在的右侧红色框中垂直居中显示“测试”文本？链接的高度为100%，因此它填充了整个td。现在，当我设置display: table-cell时，高度不再是100%。
浏览 1提问于2011-06-15得票数 1
2回答
我正在致力于缩短引导行(class="table-form")的高度。我尝试了一些方法，但只成功地改变了行的宽度，而不是高度。到目前为止，我已经尝试过：
.table-form {
position: absolute;
width: 100%;
height: 70%;
}
.table-form {
position: absolute;
width: 100%;
height: 70%;
display: inline-block;
}
以及设置
html, body {
height: 100%;
}
由
浏览 1提问于2015-10-16得票数 2
我试图垂直居中一个具有contenteditable的子div，这样用户就可以在父div的中间键入，所以文本需要垂直居中。
父div必须将它的显示设置为block，因为我需要它的顶部和底部边框具有它的容器的最大高度，因为它将被选择为一个调整大小的事件。
我尝试过许多方法，如柔性盒和垂直对齐，但它们都要求我更改父母的显示属性，但我看不到任何方法。如果JS解决方案有效且不太麻烦，我甚至会接受它。
div {
border: 1px solid black;
max-width: 100px;
outline: none;
}
.parent {
display: block;
浏览 1提问于2017-03-21得票数 0
回答已采纳
我遇到了一些问题(我已经在代码中突出显示了它们)：
问题1:我不知道如何让#dl_buttn居中- (45%是最近的)-有什么方法可以“对齐:居中”吗？问题2:我正在尝试显示一个内容寄存箱onClick -但是我的寄存箱没有弹出？-显示javascript内容寄存箱的代码是错误的吗？问题/问题3:我不想在第二次点击时显示一条消息，而是想要显示一条java警告--我尝试过这样做，但失败了--有人能帮我吗？-(它的id是' message ')
<html>
<head>
<title>Passupload Passowords - Get th
浏览 0提问于2012-02-25得票数 0
回答已采纳
我尝试在父div中垂直居中放置div，其中包含文本。下面是我得到的信息：
它看起来有点滑稽，因为文本似乎居中正确，但黄色框不是这样的。我是这样做的：
.btn {
background-color: #ccc;
color: #000;
width: 200px;
border: solid 1px black;
text-align: center;
vertical-align: middle;
display: table-cell;
}
.square {
background-c
浏览 0提问于2013-01-20得票数 2
回答已采纳
1回答
我有一个翻转表，我不能将标题居中，使其跟随溢出表的宽度。
以下是打印预览时的查看方式：
请注意，标头未居中。正常预览时，页面如下所示：
我注意到，中心对齐只是遵循它在屏幕上看到的方式。如何在此页面中居中显示标题？
顺便说一下，这是我的css：
东方大学等文本。
.header {
width: 100%;
margin: 0 auto;
height: auto;
}
等级表：
table.grades {
border-collapse:collapse;
border: #000 solid 1px;
font:Arial, Helve
浏览 0提问于2012-02-18得票数 0
回答已采纳
我有一个表格，其中显示数据通过SQL使用php。问题在于，因为第二列是一张图片(列名称为"thumbsrc")，所以第一列的文本(列名称为"photosrc")不会居中并停留在顶部。
<table class="table table-hover spacer">
<thead align="center" class="strong">
<td>NAME<
浏览 3提问于2019-05-20得票数 0
5回答
我做了一些研究，发现在div中垂直居中表格的唯一方法(表格不会跨越整个高度，高度随内容而变化)是使用javascript/jquery：
<script>
var tableMarginTop = Math.round( (testHeight - tableHeight) / 2 );
$('table').css('margin-top', tableMarginTop)
</script>
现在我的代码看起来像这样: CSS：
.rightDiv{
width: 300px
height: 380px;
浏览 1提问于2012-06-14得票数 1
回答已采纳
3回答
我的CSS代码：
body
{
padding:0;
margin:10px auto;
width:800px;
}
.wrapper
{
width:800px;
background-color:#0099FF;
}
.bannercont
{
margin-top:5px;
height:90px;
width:800px;
}
.banner
{
position:relative;
top:20px;
background-image:url(../images/livesupport.png);
width:267px;
height:32px;
}
我
浏览 0提问于2009-08-26得票数 0
回答已采纳
1回答
在这个页面上，我有3个标题，是使用创建的。
display: table-cell;
我必须以这种方式创建它们，才能以我想要的方式显示边界线。现在我正在尝试将每个标题向左、向右和居中对齐。我使用：
text-align: right;
但它什么也做不了。
如何左/右/居中表格单元格？
浏览 0提问于2020-05-15得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
