DePo Masthead – too little space above headings / too much space below headings
-
Hi, I am using the DePo Masthead theme and have purchased the custom design upgrade as part of a bundled package. I have customized the fonts, and have customized the colors using css stylesheet editor.
There seems to be very little space between my ‘Author Box Text’, and my ‘Headings’ below. At the same time there seems to be too much space between my ‘Headings’ and the menu below. This seems to be particularly apparent when viewing through Microsoft Internet Explorer browser (but also Mozilla Firefox). On the inside pages, it even causes the heading to only partially change color when hovered over.
When comparing my site to what Depo Masthead is supposed to look like (ie. the photo on right of this page http://en.blog.wordpress.com/2008/09/12/depo-masthead-theme-launch/) the difference is apparent, as there is equal distance above (to the Author Text Box) and below (to the Menu) the Headings of the basic/template DePo Masthead theme.
If someone can help me resolve this I’d appreciate it. I have searched through support and forums, etc, but can’t seem to figure it out.
Thank you.
ps – if it is helpful my CSS is below:h1 {
color:#136697;
}#menu ul li a,#menu ul li a:link,#menu ul li a:visited {
color:#136697;
}#menu ul li a:hover,#menu ul li a:active,#menu ul li.current-menu-item > a,#menu ul li.current-menu-ancestor > a,#menu ul li.current_page_item > a,#menu ul li.current_page_ancestor > a {
background-color:#999;
}#container h1 a,#container h1 a:link,#container h1 a:visited {
color:#136697;
}#container h1 a:hover,#container h1 a:active {
color:#2f9f3f;
}a,a:link,a:visited {
color:#136697;
text-decoration:none;
}a:hover,a:active {
color:#2f9f3f;
}#sidebar a:link,#sidebar a:visited {
color:#136697;
}#sidebar a:hover,#sidebar a:active {
color:#2f9f3f;
}The blog I need help with is: (visible only to logged in users)
-
I don’t know what you are referring to as an “author text box”. Can you point us to the exact page you are taking about and give us a little more explanation?
-
Also, the page you referenced is the main page when it is showing posts, and what you have on the front page of your site is a static front page and there are differences in spacing and such between the two.
-
Thanks.
Regarding the ‘author text box’, that is the little box at the top of every page that says ‘CARAVELA’. This box is very close to the heading ‘Executive English’ and in fact overlaps the heading when I view it in Microsoft Internet Explorer. Then, underneath the heading there seems to be too much space between it (the heading) and the menu (below). Hope this helps.
Regarding the exact page, the problem seems to be on all of them and they are all, including the front page, currently static pages. These pages, for example, among others:
http://exec-english.ca/bem-vindo/perguntas-frequentes/
http://exec-english.ca/bem-vindo/
http://exec-english.ca/I will have posts in the future but currently I only have static pages.
Thanks again.
-
What version of internet explorer? This is what I’m seeing in Opera, Safari and Firefox and it is nicely balanced without excessive white space.
Do you see the same issue if you view the demo site at http://depomastheaddemo.wordpress.com/ ?
-
I am using explorer version 9 and firefox version 9. When I look at the test site with both firefox and explorer it looks fine and balanced. In other words, no issue.
However, when I look at my site with these same browsers it is not balanced. I have taken screen shots and posted them on this page:
http://exec-english.ca/depo-masthead-heading-images-in-firefox-explorer/
Thank you again.
-
Thanks for the screenshots. I think this is due to the custom fonts and for some reason IE isn’t picking up, or is ignoring margins and padding on the various elements at the top of the site. This is going to be tricky to fix since I don’t have IE, and I have to make sure I don’t mess up FF and the rest of the browsers in fixing IE.
Let me look around and play with some solutions and see what I can come up with for you to try.
-
Add this to your custom CSS and see what it does for the spacing above the title. It should not change things in FF, Safari, Chrome or Opera since they are recognizing the top margin on the title (IE isn’t) and by adding the top margin on #header it should make everyone happy I hope.
#header { margin-top: 55px; } -
Thanks for the suggestion.
I added it but it did not make a difference.
However, as you suggested it might be due to the custom fonts, I experimented with various fonts and found that most of the others look fine, without any spacing issues. Although I liked the ‘FF Market’ font, it is not critical that I use it, and it is certainly not more important than the spacing issue. So I have just changed the custom font to another, and the space around the headings looks perfect in FF and IE now.
So I am happy to consider this closed unless you think there’s something else I should do.
Many thanks for taking the time to assist. I really appreciate it.
- The topic ‘DePo Masthead – too little space above headings / too much space below headings’ is closed to new replies.
WordPress.com Forums 