By drinkingsouls on

Hey, I began building my own theme using the Zen theme starter kit. I have had a few issues but have solved them all up to now apart from this one.
My Drupal homepage is at: http://www.theamazingspacefrogs.co.uk/drupal/
Ignore all the text and such im just testing it.
The divs are colored brightly so its easier to tell them apart. The problem is underneath the submitted div and above and below the links comment div, there are red gaps. The red div is the .node-inner div.
I cannot figure out whats causing the gaps, Ive tried setting the margin and padding to 0 where I thought it could be, but have had no luck.
Does anyone have any solutions?
Any help would be appreciated.
Thanks

⋅ Categories: Drupal 5.x

Comments

drinkingsouls’s picture

drinkingsouls commented

FORGOT TO MENTION: There are also gaps on the pages, see here: http://www.theamazingspacefrogs.co.uk/drupal/?q=node/6

Jeff Burnz’s picture

Jeff Burnz commented

For the first page you cite, the margin is actually coming from the paragraph tag

html-elements.css (line 115)
p, ul, ol, dl, pre, table, fieldset, blockquote {
margin: 1em 0pt;
}

Get Firebug for Firefox, you'll never look back.

Pimp your Drupal 8 Toolbar - make it badass.
Adaptivetheme - theming system for people who don't code.
amandawolfe’s picture

amandawolfe commented

Hi there! I'm no super-CSS expert, but a little Firebugging (do you have the Firebug Firefox plugin? It's wildly helpful) and it seems to be coming from your .node-inner class, which is styled with a background of red. Since the other elements don't have padding, they're not covering it up. Two solutions: One, ditch the red background in .node-inner class. Or you could add bottom padding to .node .submitted (or top padding to .node .content) depending on how you want it to look (what color you want that space to be, etc.)

Also, if .node-inner is how you're styling the left sidebar red-ness (didn't dig in that far!) then you can use a selector to just get rid of that class for the middle content.

Hope that helps!

amandawolfe’s picture

amandawolfe commented

D'oh. You know, or the paragraph tag. ;) For some reason I was concerned with the color, not the actual space which was the actual problem. Sigh. I need to get out on a Saturday night!

Jeff Burnz’s picture

Jeff Burnz commented

No its not, its coming from the paragraph...

Its impossible to be coming from the inner div since that is wrapping all the elements in the node...

The red is there for theming purposes, and good on it, it makes things real easy to see.

Pimp your Drupal 8 Toolbar - make it badass.
Adaptivetheme - theming system for people who don't code.
amandawolfe’s picture

amandawolfe commented

Yep. Time to turn the computer off and do something else. I've been working all day! :)

drinkingsouls’s picture

drinkingsouls commented

Thanks guys for your help. I set the p margin to 0 and its gone.
I have another small issue, if you go to the homepage now: http://www.theamazingspacefrogs.co.uk/drupal/
Look at the top title of the first post, see how its pushed down a little by another green span?
For some reason the code < h1 class="title"> is on the mainpage, when it should only be on the content pages as thats the h1 span for the content page titles.
If you view page source of the homepage and go to line 78 you will see what I mean, < h1 class="title"> is there, but with no reason, how would I get rid of it?
Thanks
p.s - the theme Im using is BlueFire

Jeff Burnz’s picture

Jeff Burnz commented

You need to loot at the page.tpl.php file - if there is no "if" conditional statement around the title html then it will always print, even if the actual variable is empty, needs to look like this..

<?php if ($title): ?>
  <h1 class="title"><?php print $title; ?></h1>
<?php endif; ?>
Pimp your Drupal 8 Toolbar - make it badass.
Adaptivetheme - theming system for people who don't code.
drinkingsouls’s picture

drinkingsouls commented

Sorted.
Thank you very much for your help.

drinkingsouls’s picture

drinkingsouls commented

Hey, Im having the same issue now with the page I created and promoted to the top of the mainpage, If you look at it you can see it has a blue underline which is from the:

This is the same, its in the code on page.tpl.php and it shows for that post on the mainpage but I dont want it too. How would I stop this?
Thanks

prestonso’s picture

prestonso commented

Your problem is being caused by an empty div that has the class meta. Just execute the code in the PHP the same way as you did with $title:

<?php if ($meta): ?>
<div class="meta"><?php print $meta; ?></div>
<?php endif; ?>

This should theoretically do it.
___________________

Preston So
Web/Print Designer
Monarch Digital, Colorado Springs
My near-dead non-Drupal site

___________________

Preston So

drinkingsouls’s picture

drinkingsouls commented

Im having trouble adding the IF code, this is the way it looks in node.tpl.php

if ($submitted) :
print t('By ') . theme('username', $node) . t(' - Posted on ') . format_date($node->created, 'custom', "F jS, Y");

endif;

See how its mixed with the submitted code too? Im not sure how to order the two so not to mess with the layout.