• 0

Add padding to 'tabs' (shortcode) globally


Question

Posted · Report post

Hi, I would like to add padding to the 'tabs' short code, globally so there is more space on the left and right throughout my site.

 

Here is an image of my section, and as you can seethe image lines up flush with the end of the tab.

http://postimg.org/image/lz0l3wtrx/

 

I would like to add 10px of padding to the left and right, I think I am on the right track with:

 

 

#site .tabs {
padding-right:10px;
padding-left:10px;
 
}
 
I am not sure what the identifier/property is.
Any help would be greatly appreciated, Thanks

Share this post


Link to post
Share on other sites

13 answers to this question

  • 0

Posted · Report post

Update, you gave me the wrong link :D

 

You should have give the Our Clients page link, nevermind. Add the following to your custom CSS:

 

#site .tab-content {
padding: 30px;
box-sizing: border-box;
}

http://d.pr/i/mG3D

 

Change the 30px value to whatever, you like. The more information on why I have added Box-sizing, see here - http://www.w3schools.com/cssref/css3_pr_box-sizing.asp

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Toby

Did you try with the tab-content class instead of the tabs class (not sure this one exists)?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Toby,

 

I think Erwan is right and you should be targeting the tab-content class.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I applied it to the tab-content class and achieved this result:

http://postimg.org/image/uiokferi5/

 

As you can see it has pushed the white space over the 'content/loop' area, also it does not line up with the top line.

Is there a way to keep the padding within the 'content/loop' section?

 

If you want to compare this is what it looks like before i apply the padding:

http://postimg.org/image/lz0l3wtrx/

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Can you provide a link to the page in question please.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

The site has an under construction banner on it at the moment.
I can take it down for 10 minutes if you like?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Yeah sure, just reply here when you have taken it down, don't forget to link the page you're referring too.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks Danny.
The site is active now.

The page is:
www.innovativethinkingit.com.au/news

I will put it back up in 10mins.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

That page doesn't contain any tabs ?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I'm sorry I linked the wrong page.
The correct one is
www.innovativethinkingit.com.au/markets

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Amazing thanks Danny!!
The site is still up if you want to see what it looks like :)

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Site is back up now.
Thanks again for the help Danny"] and @[member="Erwan

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

No problem.

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