Safari有时不会水平居中显示文本
问题：Safari有时不会水平居中显示文本。
回答：这个问题可能是由于Safari浏览器对CSS样式的解析存在一些差异导致的。要实现在Safari中水平居中显示文本，可以尝试以下方法：
- 使用Flexbox布局：使用CSS的Flexbox布局可以方便地实现水平居中。将文本所在的容器设置为display: flex，并添加justify-content: center属性，即可将文本水平居中显示。
- 使用text-align属性：将文本所在的容器设置为text-align: center，这样可以将文本内容在容器中水平居中显示。
- 使用margin属性：将文本所在的容器设置为margin: 0 auto，这样可以通过自动分配左右margin值，将容器中的文本水平居中显示。
- 使用transform属性：将文本所在的容器设置为position: relative，并添加left: 50%和transform: translateX(-50%)属性，这样可以将容器中的文本水平居中显示。
以上是一些常见的解决方法，具体选择哪种方法可以根据具体情况进行调整。如果问题依然存在，可能需要进一步检查和调试相关的CSS样式，确保没有其他样式属性干扰。
腾讯云相关产品介绍链接：
- 腾讯云文档中心：https://cloud.tencent.com/document
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 人工智能服务：https://cloud.tencent.com/solution/ai
- 腾讯云物联网平台：https://cloud.tencent.com/product/iothub
请注意，以上链接仅为示例，实际应根据需要在腾讯云官网进行查找相关产品和服务信息。
相关·内容
2回答
我正在尝试在照片中居中显示文本。它在chrome/mozilla中工作得很好，尽管Safari有一些问题。下面是来自不同浏览器的div截图： Safari： ? Chrome： ? 在Safari上刷新页面时，文本通常居中。 我没有任何想法来解决这个问题。{ color: white;
} 预期行为: subCategoryName类总
浏览 26提问于2019-10-14得票数 0
2回答
我正在尝试在我的选择中居中显示文本。我在safari中使用text-align:-webkit-center；(text-align:center；什么也不做)让它工作。但是当我运行text -align：-webkit-center时，在我的phonegap webview中，文本没有居中。Ps。中心是水平的，而不是垂直的。
谢谢!
浏览 17提问于2013-10-16得票数 2
shouldDisplayImage { }}
但我希望VStack中的两种文本都以水平居中，图像有时被显示，有时隐藏在标题文本旁边。
浏览 4提问于2022-01-18得票数 0
我有一个既包含图像又包含一些文本的容器。我想要的文本是垂直和水平居中的图像。='text'> </div></div>文本在两个轴上居中这似乎适用于所有现代浏览器.....除了Safa
浏览 5提问于2017-06-08得票数 9
回答已采纳
2回答
我尝试在chrome和safari中水平和垂直居中选择框。这是jsfiddle - [http://jsfiddle.net/xeqLsdo6/]提前谢谢你。
浏览 3提问于2015-05-26得票数 0
我在一个<div>元素中有两个<p>元素，并希望将它们放在<div>元素的中心。例如： <p class="above">some text</p></div>
浏览 0提问于2012-08-15得票数 0
4回答
在我的场景中，HTML页面的宽度是有限的(使用max-width)，这样页面上的文本就不会变得太宽(而且很难阅读)。是否有一种方法可以使表居中，这样即使它溢出其父表也能保持居中状态？下面是我的场
浏览 3提问于2012-08-30得票数 2
回答已采纳
2回答
这是我需要的：
所有的项目都水平布局。如果它们比屏幕更宽，菜单的右侧会出现两个小箭头，用于滚动菜单。它们应该垂直和水平地延伸到内容。项目中的文本应该在垂直和水平方向上居中。该菜单应在IE7/Opera/FF/Safari中工作。但是如何使菜单项如此具有伸缩性，可在任意位置点击并居中显示文本？
浏览 4提问于2008-12-09得票数 0
回答已采纳
我有一个子表单，它封装了两个文本字段。我将子表单设置为Flowed / Western，以便内容从左到右。问题是，我希望子表单(或内容)是居中的，而我无法找到如何做到这一点。我不使用位置的原因是因为两个文本字段中的每个文本都是动态的。
浏览 3提问于2012-08-13得票数 0
橙色div的高度和宽度由动态文本内容控制，我们事先不知道这些内容，但橙色div应该在红色div中水平居中，两侧宽度相等。它有时是可见的，有时是不可见的(由javascript控制-无论是可见性还是显示，无论哪个效果最好)，但在任何一种情况下，它都不应该影响橙色div的水平居中。我可以添加额外的div，或者更改为跨度，任何类似的东西，但目前我尝试的任何东西都意味着，当我需要蓝色div时，橙色div的水平居中的流将考虑到
浏览 20提问于2017-08-17得票数 1
回答已采纳
4回答
居中文本不工作
、、
我有一个带文本的span和一个包装它的div。我正在尝试在span中居中显示文本。我尝试使用flexbox将其居中，但它不起作用。它是水平居中的，而不是垂直居中的。我做错了什么，我如何才能纠正它？( span存在的唯一原因，是为了让我可以将文本居中。如果我可以在不使用span的情况下将文本居中，那么我就不会使用它。)
浏览 64提问于2016-09-02得票数 0
回答已采纳
1回答
数字所在的文本不会垂直中心。文本以水平居中的方式显示，但显示在标签所在的框的顶部。如何使文本显示在JLabel的中间？
浏览 1提问于2014-05-14得票数 0
回答已采纳
2回答
标签中的居中包装文本
、、、
我正在寻找与包装文本css标签的例子，文本是垂直和水平的居中。就像这样：我想知道这是否可以通过简单的ul-li节点层次结构来完成，或者我是否需要包括额外的层(例如div或span)。我需要一个跨浏览器的解决方案(IE 7+，火狐，Chrome，Safari)。
浏览 7提问于2011-12-06得票数 0
回答已采纳
我正在尝试使用reportlab在自定义大小的PDF上水平居中显示一个简单的文本。我的代码如下。我尝试过使用doc.drawCentredString，但这会截断文本的开头。现在，文本在左下角对齐。但由于文本将是动态的，我不能真正设置一个固定的水平位置，因为它不会总是居中。doc.setFont("Helvetica", 14)
doc.drawString(0,0,"Hello Wor
浏览 178提问于2021-07-06得票数 0
回答已采纳
android:ellipsize="end"</RelativeLayout>
我想让状态文本(TvStatus)保持水平居中(以及垂直居中)。问题是有时，状态文本非常长，并且与左侧的文本视图重叠(tvUsername)。有没有办法防止这种情况发生？我尝试添加android:lay
浏览 2提问于2014-10-13得票数 2
1回答
我想在ScrollPanel中垂直和水平居中放置FormPanel。我尝试了几种方法，但都没有成功。我将滚动面板和水平面板都设置为100%的宽度和高度。但是，滚动面板会根据DockLayoutPanel的中心部分的大小自动调整大小，而水平面板的大小始终等于其子窗体面板的大小。所以我不能在horizontalPanel中居中表单面板，因为它们的高度和宽度是相同的。我尝试使horizontalPanel的大小始终与scrollPanel相同，但我不知道如何做到这一点。所以我的问题是：
1.如何在scrollP
浏览 2提问于2012-07-31得票数 3
我试图简单地设置我的选择框的样式，使文本居中对齐。它可以在Firefox中运行，但不能在Safari或Chrome中运行。当检查Chrome中的元素时，它显示文本居中，但事实并非如此。有没有人知道为什么它不以Chrome和Safari为中心？
浏览 5提问于2013-05-11得票数 0
我有一个设置，我试图让一个div在屏幕上居中，但div flex-wrap中的图像是基于父div宽度的。浮动:向左；由于居中问题不起作用。display: -ms-inline-flexbox; flex-wrap: wrap; /* flex-wrap not working in Safari
浏览 1提问于2015-01-30得票数 1
4回答
我希望将输入文本框中输入的文本垂直居中。
实现这一点的典型方法是将行的高度和高度设置为相等。这可以在iOS 5.0之前的Safari上运行。然而，在iOS 5上，Safari会垂直居中显示键入的文本...但占位符文本和光标显示为顶部对齐。
浏览 2提问于2011-12-19得票数 29
回答已采纳
3回答
我尝试在居中文本的左侧显示图像！但我所做的唯一一件事就是居中显示图像+文本！我只希望文本水平居中，然后图像在他的左边，两者都垂直居中
<div id="the-block"><div class="titleproduct" style="text-align: center;
浏览 1提问于2018-02-07得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
