Organization Theme: Post Tabs

• 

  cvlighthouse · Member · Apr 1, 2016 at 12:28 am

  • Copy link
  • Add topic to favorites

  Hello. I’m trying to write the correct code to shrink the size of the Post Tabs on the middle section of the front page (next to latest articles). I notice that the tabs might be too wide and sometimes it mounts onto the next tab in the same block area. Please advice: cvlighthouse.com

  Thank you – Jorge

  The blog I need help with is: (visible only to logged in users)

• 

  charliescheer · Member · Apr 1, 2016 at 10:53 pm

  • Copy link

  Hello,

  Try adding this code to your CSS.

  .home-tabs.ui-tabs.ui-widget.ui-widget-content.ui-corner-all {
  width: 80%;
  float: right;
  }

  That will shrink the recent posts section. If you then want to increase the size of the Latest Articles section add this text.

  .home-news {
  width: 110%;
  }

  I hope this helps, let me know if you have any questions.

• 

  thesacredpath · Member · Apr 1, 2016 at 10:58 pm

  • Copy link

  Hi Jorge, I’m not quite understanding what you mean by it “mounts onto the next tab in the same block area”. Are you talking about on smaller screens, such as phones where the tabs are one on top of the other? If so, we can set a maximum width for the tabs at 49% which will keep them from stacking. This would be the CSS.

  .ui-tabs .ui-tabs-nav li {
  max-width: 49%;
  }