问题标签 [vertical-alignment]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
3 回答
1007 浏览

html - 使相邻表格单元格中的项目垂直对齐时出现问题

我对一些表格行有很大的样式问题。根据此屏幕截图:

替代文字

蓝色和红色圆圈是表格行中的单元格(高度为 50 像素)。两者都采用 "vertical-align:top" 样式。电话号码数据(在红色圆圈中)实际上是一个以竖线分隔的字符串,我用 HTML 中断代替了竖线。

在绿色圆圈中,传真标签是“vertical-align:top”,但传真号码的实际列表(也是分隔的)是vertical-align:middle。

我想要的是让这些东西整齐排列,顶部的电话号码/传真与标签垂直对齐。我替换电话/传真字符串中的管道中断是导致此问题的原因吗?有没有一种方法可以在不更改数据库表/应用程序的情况下获得我想要的东西?

更新:我通过表格单元格上的一些填充来实现这一点。我之所以这么说,是因为它看起来大多是一字排开的,但我有一种下沉的感觉,这不是因为我想要它,而是因为随机的机会。并且有一天它会在我最需要它看起来最正确的时候出卖我。

0 投票
3 回答
20740 浏览

css - 在 div 中垂直居中列表

我希望我的导航链接垂直位于父 div 的中间。我怎么做?

HTML:

CSS:

0 投票
1 回答
9992 浏览

css - 在输入元素中垂直居中文本

我有以下输入元素(我故意省略了示例不需要的属性):

在 Chrome 和 Internet Explorer(也可能是 Opera)中,输入中的任何文本都将垂直居中。然而,Firefox 似乎忽略了这个声明。将其设置为display: inline-block;,或使用vertical-align: middle;在 Firefox 中无效。

我还尝试将顶部和底部填充设置为13px,并将高度设置为14px,这(与字体大小相结合)将导致元素40px高。这按预期工作;除了任何带尾巴的字符(如gqj等)在底部被切断。

我正在寻找一种跨浏览器解决方案,用于在具有固定高度的输入框中垂直对齐文本。输入元素将有自己的悬停和焦点样式,因此通过将元素本身垂直定位在40px高大的空间中来伪装居中并不是一个真正的选择。

干杯

0 投票
3 回答
111 浏览

vertical-alignment - 将图像与文本对齐

我想将 18px 高度的图像与旁边的文本居中对齐。这是我使用的代码:

使用该代码,div 容器以 19px 而不是 18px 的高度呈现,并且文本不以图像为中心。我试过 Safari 4 和 Firefox 3.6。那 1 px 的原因是什么?

谢谢

0 投票
2 回答
6132 浏览

jquery - 使用jQuery垂直对齐Div以设置margin-top

谁能告诉我哪里出错了......我正在使用以下内容通过设置margin-top来垂直对齐div,使用(window).height。625 是 Div 居中的高度...

这在 Firefox 中有效,但 IE7 在调整浏览器窗口大小之前不会设置 margin-top。

测试站点位于http://guylloyd.co.uk

任何想法都会非常感激!

马丁

});

0 投票
3 回答
830 浏览

html - css/html: 垂直 div-alignment-Problem(添加了现场演示)

在这种情况下,我在对齐一些 div 时遇到问题:

(当然这只是一个重现我想要避免的行为的例子。)

我本来希望 content-div 与 container-div 对齐。因此,“序言”和“内容”之间应该总共有 150 像素。

但是,(至少在 Firefox 中)情况并非如此。container-div 被简单地忽略,因此 content-div 的 margin-top 也被忽略,只要它不大于 preamble-div 的 margin-bottom 的 margin-top。

我能做些什么?我必须申请额外的 css 规则吗?我想保持位置:相对以及 html 结构。

谢谢!

[编辑2]

希望你还在我身边;-)

抱歉耽搁了……这里有一个现场演示。它是如此生动,我什至做了一个小的 jquery-script 来说明问题 - 只需尝试一下按钮。 现场演示

谢谢!

[编辑]

事情是这样的:

坏的
(来源:666kb.com

我想要的方式(无边界)

替代文字
(来源:666kb.com

我希望区别很明显,尽管图像很生涩;-)

0 投票
4 回答
107022 浏览

image - 子图的垂直对齐 LATEX

我正在写我的论文,我正在努力将 2 个图像彼此相邻放置,以便第二个图像将沿着第一个图像垂直居中。我也试图使用subfigure而不是,subfloat但它们都不起作用。

这就是它的外观替代文本 http://img51.imageshack.us/img51/1174/screenshot20100224at712.png

我的代码是:

有什么建议可以让它看起来比现在更好吗?谢谢

0 投票
3 回答
2963 浏览

latex - 如何在 LaTeX 表格中通过冒号对齐时间?

我有一个我在 LaTeX 中的时间的表格。

这些时间采用 4:00 或 12:00 的形式,并且具有不同的长度。我想用冒号垂直对齐这些时间。在 LaTeX 中有一个很好的方法来做到这一点吗?

0 投票
2 回答
2631 浏览

html - 如何使用垂直对齐:中间;适当地?

我想让我的列表(导航)与图像(徽标)的中心对齐。我尝试使用vertical-align: middle;,但是当我左右浮动图像时,我无法让它工作。

这是我的代码:

HTML:

CSS:

我从我放置它们的地方取出了所有的vertical-align: middle;(我在每个元素中测试了它,即使它只应该应用于#logo,从我读过的内容来看。)

无论如何,任何帮助将不胜感激。

0 投票
7 回答
149737 浏览

android - Android:多行EditText(文本区域)的垂直对齐

我想要 5 行作为文本区域的高度。我正在使用以下代码。

文本区域看起来不错,但问题是光标在文本字段的中间闪烁。我希望它在第一行,在文本字段的第一个字符处闪烁。