2014-01-07 33 views
-1

这里有一个链接: http://www.cultsectsclothing.com/shop为什么我的头不在中心?

有人可以帮我吗?我无法弄清楚为什么标题不会居中。相反,它一直到最右边都很笨拙。我觉得这是很简单的东西,但我不知道......

我已经尝试重做对CSS和HTML中级联布局的头。这与我在所有其他页面上做标题的方式一样。我只需要愚蠢的标题居中,出于某种奇怪的原因,它不是。

我检查我的标签,并确保他们符合了我的太多。帮帮我??

+4

关于与你写必须说明具体问题的代码问题的问题 - 和包括有效的代码来重现它 - 在问题本身。 – 2014-01-07 06:51:50

+0

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.cultsectsclothing。com%2Fshop&charset =%28detect + automatic%29&doctype = Inline&group = 0 – Quentin

+0

'position:fixed;'and'left:0;'This will help you –

回答

0

Demo JsFiddle

#header添加margin: 0 auto;。这将解决您的问题..

HTML

<div id="header"><a href="/">CULT SECTS</a></div> 

CSS

#header { 
    font-size: 60px; 
    font-style:oblique; 
    font-weight:bold; 
    color: #000; 
    text-align: center; 
    margin 0 auto; 
    width: 100%; 
    min-height: 30px; 
    display: inline-block; 
} 
0

你可以用它为您的标题:

#header { 
    width:980px; 
    height:130px; 
    margin:0 auto; 
} 
0

而不是

width: 1000px; 

width: 100%; 

上的#header CSS样式。 它看起来就像这样:http://d.pr/i/2OKD 和固定将仍然存在,那么,你的“标志”不会滚动(如菜单)。

1

给CSS像这样#header,也将努力不要怀疑!

#header { 
font-size: 60px; 
font-style: oblique; 
font-weight: bold; 
color: #000; 
position: fixed; 
top: 30px; 
width: 100%; 
min-height: 30px; 
display: inline-block; 
text-align: center; 
margin: 0 auto; 
} 
0

试试这个

#header { 
font-size: 60px; 
font-style: oblique; 
font-weight: bold; 
color: #000; 
position: fixed; 
top: 30px; 
width: 100%; 
min-height: 30px; 
display: inline-block; 
text-align: center; 
margin: 0 auto; 
} 
0

在上下文你的代码,你只需要两个属性添加到您的#header的规则,这是左:0,宽度:100%(删除你的1000像素为我假设你只是想为中心的标题和不关心一个确切的宽度)

参见下面的代码块中的最后2个属性:

#header { 
font-size: 60px; 
font-style: oblique; 
font-weight: bold; 
color: #000; 
position: fixed; 
top: 30px; 
min-height: 30px; 
display: inline-block; 
text-align: center; 
left: 0; 
width: 100%; 

}

http://jsfiddle.net/uberrobert/F4TgR/

这将使你的头从右侧回来,我看到在Firefox这种行为:)

相关问题