将页面标题居中对齐的CSS样式:

huangapple go评论71阅读模式
英文:

CSS to align page title center width

问题

有人可以看到我漏掉了什么吗。我只是试图将页面标题居中对齐。然而,无论我尝试什么(我尝试了20种不同的值)都不起作用。

.ast-archive-description {
	background: #000000 !important;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	padding-left: 0px !important;
	padding-right: 0px !important;
	width: 100% !important;
}
.ast-archive-title {
	text-align:center !important;
	color: #FFCC00 !important;
	width: 100% !important;
}

在这个页面上:
https://holyspiritprints.com/category/fine-art-prints/sweet-psalms-arizona/

英文:

Can anyone see what I'm missing. I'm just trying to align the page title center width. However, nothing works. The h1 element doesnt to go to 100% width of its parent container (really the browser width), no matter what I try (I've tried 20 different combinations of values)...

.ast-archive-description {
	background: #000000 !important;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	padding-left: 0px !important;
	padding-right: 0px !important;
	width: 100% !important;
}
.ast-archive-title {
	text-align:center !important;
	color: #FFCC00 !important;
	width: 100% !important;
}

It's on this page:
https://holyspiritprints.com/category/fine-art-prints/sweet-psalms-arizona/

答案1

得分: 1

在您的页面上进行了一些抓取后,我注意到有很多规则被覆盖(规则被划掉的情况)。这应该避免,因为它使人难以看清规则适用于哪里,同时增加了不必要的 CSS。这里有一个有问题的规则:

body.archive .ast-archive-description {
    max-width: 1200px;
}

禁用它会使文本居中。如果编辑这个 CSS 不是一个选项,您可以覆盖它以取消设置:

body.archive .ast-archive-description {
    max-width: unset !important;
}

还请注意,您已经两次包含了相同的 CSS 文件(我不知道这是否是 WordPress 的问题)。

英文:

After scraping about a bit in your page, I have noticed a lot of rule overriding (where the rule is crossed out). This should be avoided as it makes it hard to see what rules apply where as well as adding unneccary css. The offending rule here is this:

body.archive .ast-archive-description {
	max-width: 1200px;
}

Disabling it centeres the text.
If editing this css isn't an option you can override it to unset

body.archive .ast-archive-description {
	max-width: unset !important;
}

Also note that you have included the same CSS file twice (I don't know if this is wordpress' fault)

答案2

得分: -2

尝试添加以下内容:

.ast-archive-description {
  max-width: none;
}
英文:

Try to add the following:

.ast-archive-description {
  max-width: none;
}

huangapple
  • 本文由 发表于 2023年6月19日 02:27:23
  • 转载请务必保留本文链接:https://go.coder-hub.com/76502015.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定