如何移除标题中的额外空间?

This is the site: http://www.indiansummerfestival.ca

这是一个网站:http://www.indiansummerfestival.ca。

Basically I want the webpage to start right at the top of the orange banner (i.e. no white space between banner and top of the page).

基本上，我想让网页从橙色旗帜的顶部开始(即在横幅和页面顶部之间没有空格)。

I tried using Chrome inspector but I have no idea where the extra 100-ish pixel amount of white space came from. The files involved is style.css and there's another chunk of css outside of the stylesheet.

我试过使用Chrome检查器，但我不知道额外的100像素的白色空间来自哪里。所涉及的文件是样式。css和样式表之外还有一大块css。

I tried pasting the code but it looks pretty messy, so I think the best way is to find <div id="header"> in the HTML code.

我尝试过粘贴代码，但是看起来很乱，所以我认为最好的方法是在HTML代码中找到

Thank you so much.

非常感谢。

4 个解决方案

#1

You can apply this to compensate?

你可以用这个来补偿?

#header {
    margin-top:-45px;
}

Semi-hacks, but works? :)

Semi-hacks,但工作吗?:)

#2

Your #socialLinks and #mc_embed_signup divs are positioned relatively as siblings to #logo. Despite the fact you're ofsetting those divs, they are still calculated as being in the flow, thus pushing the #logo down. Try positioning those 2 divs absolutely; that should fix it.

您的#socialLinks和#mc_embed_signup div相对于#标识来说是相对的。尽管你设置了这些div，但它们仍然被计算为在流中，从而将#logo压下来。绝对要尝试定位这两个div;这应该解决它。

#3

A similar problem with firefox I resolved adding in my CSS :

我在我的CSS中添加了一个类似的问题:

*{margin:0; padding:0;}

Ps: I am somehow unable use comments... :(

Ps:我无法使用注释……:(

#4

It has something to do with the mailchimp and social plugins that you are using. They each seem to be adding some pixels to the top. If you remove those the orange header is aligned with the top. You'll have to take a look at how those style sheets are playing with your own.

它与您正在使用的mailchimp和社会插件有关。他们每个人似乎都在往顶部添加一些像素。如果你移除那些橙色的标题与顶部对齐。你必须看看这些样式表是如何和你自己一起玩的。

#1