• 0

control padding in mediabox - background color


Question

Posted · Report post

I require a box that has a specified background color floating over the main page background image. The box needs to have NO PADDING around the image, but below the image, background color that will allow the text to be seen.

 

Have created 2 columns and placed a MediaBox in the left column and will place main content text in the second. I will need a padding in the second box so text doesn't run into the edges of the background, but no padding under the 1st.

 

Actually, what I really need is a section into which I place 2 columns as above, Then the container section can have the background color which will encompass both colums.

 

Reference:

http://westcoastfacemasks.com/BLOG/facemask-reconditioning-process-faqs/

trying to mimic this static HTML layout:

 

If I have to do this in CSS, what's the best way to establish the area to which to apply the style??? In Firefox, I have familiarity with the inspector there, but things are so nested, not sure where to start the CSS definition? Advise?

 

Thanks for your ideas...

Share this post


Link to post
Share on other sites

2 answers to this question

  • 0

Posted · Report post

Hi there,

 

If you look in the inspector in firefox on the image, then scroll up through the html you'll get to a point where the padding around the image is highlighted in dark blue, so you know the padding is applied to that element.

 

On your site, that showing as

 

.pl-section-pad {

    margin-bottom1em;
    padding8px;
}
 
However, as that class .pl-section-pad is being used throughout the site, you'll need to use ID for the sectionbox that item is in to make sure it only applies the fix to that section-pad, not all the others. Something like the below
 
#mediaboxc5zhb7

.pl-section-pad {

    margin-bottom: 0;
    padding: 0;
}

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now