Archived

This topic is now archived and is closed to further replies.

  • 0

2 Questions - changes to more foot colour scheme & removing white spaces


Question

Posted · Report post

Hi Newby here!   :geek:

 

I have just down loaded your Theme and have been happy plugging away at it, but I think I now need some CSS changes (please note I am not an expert at this by a long shot!)

 

1. I want to change the content area of the MoreFoot Area to #649719 with the text being white.  I only want the green area to go across the morefooter element and not the whole page. 

 

I have installed a child theme and your customization plugin, looked around with Firebug (as your manuals suggest) but can't actually see where the colour needs to be changed!

 

2. I have a lot of white spaces around boxes and content boxes which I need to remove.  Again I have looked around with firebug and can see it relates to the <div class="hentry cb-standard">

 

 

.hentry {
    clearboth;
    margin0 0 1.8em; (this needs to be changed to 0 0 -2.2em)
 

 

.hentry {
    clearboth;
    margin0 0 -2.2em;

 

But again have no clue what I should be doing in the custom CSS - Sorry if I'm being a bit thick.  All help greatly appreciated.

 

Thanks very muchy

 

Attached is what I am trying to achieve - this is where I have got to! 

 

http://54.228.210.228/wordpress/

 

Share this post


Link to post
Share on other sites

8 answers to this question

Posted · Report post

Hi there,

 

Your screenshot is showing the correct area, .content which translates to the same code Danny pasted above. You'd put the section morefoot first in the css, followed by the content area inside the morefoot.

 

.section-morefoot .content {background:#649719;}
 

If that's not taking it could be that you need to place an override in front, like #page or #site to make this more specific. Please see the section on overrides in this page (half way down) - http://support.pagel...ion/custom-css/

Share this post


Link to post
Share on other sites

Posted · Report post

OK, I've looked at everything you said and have literally spent all day playing with this and still can't see how to change the colour in the morefoot. Area (when I do change colours it changes it across the whole website)

 

I've managed to make all the other changes I needed to via the CSS, but I can't see/seem to change it correctly - frustrated isn't the word!  :phew:

 

I can isolate the area in question in Firebug (see attached) but then I am at a complete loss.  It shouldn't be this difficult to change this area to #649719 colour!

 

 

Help! (In a Penelope Pit Stop kind of voice!)

post-48750-0-08271200-1362591080_thumb.g

Share this post


Link to post
Share on other sites

Posted · Report post

I was clearly having a bit of a mental day yesterday!!!

 

This now appears to be working fine  :D

 

Thanks VERY MUCHY for your assistance

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there

 

If you've not see this page in the docs yet http://support.pagelines.me/docs/customization/custom-css/ take a look as it will show you the process of finding the correct elements inside in firebug and editing them.

 

When you inspect the element in the morefooter section, scroll up and down through the html list in the bottom left window in the browser and you'll see a blue frame highlight which area this if affecting in the site preview above. When you get the blue hover around the correct area in the morefoot, click on that div in the html and then you'll be able to adjust the color for that section in the css on the right. (see screenshot below)

 

To remove the white areas around each section, use the same method as above but when you see a thick dark blue border that means there's padding applied to that area. When the dark blue covers the white areas, you'll know you've reach the right area to remove the padding in the css.

 

http://screencast.com/t/Izmj2FEi6

Share this post


Link to post
Share on other sites

Posted · Report post

Danny & James

 

Thanks again for your response.  This is one learning curve! lol

 

That code only changes the Font Colour in the .morefoot not the content area! :startle: I would have thought it was a background-colour, however when I change that, it does it across the whole website background........

 

Answers on a postcode......

Share this post


Link to post
Share on other sites

Posted · Report post

James

 

Thanks for the response. :) 

 

I understand the Firebug element and how to locate the relevant points within the CSS and have now managed to resolve the 'White Space' issue, however I can't seem to locate where I need to change the colour in the morefooter!

 

I attach the relevant HTML & related CSS.

 

Clare

MoreFooter.rtf

Share this post


Link to post
Share on other sites

Posted · Report post

Hi again,

 

If you could put the code into the site for us and then let us have the url so we can see what's happening for you.

Share this post


Link to post
Share on other sites

Posted · Report post

You can find this with Firebug or your browsers built-in tools, depending on how you wish to have it styled, you would most likely need to use either:

 

.section-morefoot .texture { }

or

.section-morefoot .content {}

Share this post


Link to post
Share on other sites