Capability Support

Support

• Main
  • Blog
  • Documentation
• Discussions
• Activity
• Sign In

• dwolverton March 2012

  Hi Kavin,
  
  Is there a way to customize the CSS in a child theme so all the content in the tabs component prints out on a page in the order of the tabs. Currently the component prints out as an outline of the component and the content of the selected tab. Would be quite useful to add css to include all the content when the user want to print the page.
  
  Thanks,
  Dave
• kavin March 2012

  Hello Dave, Most of the themes contain separate print.css that helps you ease this task. Further you can customize the stylesheet and include a media -print section as like
  
  
@ media print {
.ui-tabs-panel { display : block !important; visibility : visible !important; background : 0px; border: 0px; box-shadow : none; border-radius: 0px; }
.wp-tab-content .wp-tab-title { display : block !important; }
.ui-tabs-nav { display : none !important; }
}

  
  You can try this on Optiosn page -> Styles -> Custom css as well.
• dwolverton March 2012

  Hi Kavin,
  
  Okay I have the CSS added to control the printing on the options page. Is there CSS to print all content in all the tabs?
  
  Thanks,
  Dave
• dwolverton March 2012

  Actually, the issue is formatting each tab to print the same. I have each tab printing, the issue is the first tab content prints in a narrow column the remaining tabs print in a wider format. So I would prefer for all to print in the wider format. Ideas?
  
  Thanks,
  Dave
• kavin March 2012

  Hi Dave,
  
  There was an formatting issue with the last snippet i posted, please try this - http://pastebin.com/nZHyHfHv, first in the custom css tab, if it doesnot seem to work, please
  
  1) Try clearing the browser cache.
  2) Try appending this snippet into you theme's stylesheet.
  
  That said, there is also likely your theme might have a print.css stylesheet.
• dwolverton March 2012

  Hi Kavin,
  
  The new CSS took care of everything except the first tab contents are formatted in a taller narrow column. The remainder of the tabs content format is wider and consistent. Just seems to be an issue with the contents of the first tab.
  
  Thanks,
  Dave
• kavin March 2012

  Hello Dave, this must some style rules from the theme/other plugin. Can you share a link to the test page please? :)
• dwolverton March 2012

  Hi Kavin,
  
  I'm developing locally so no link to post at the moment. The theme is Twenty Eleven with some styling in a child theme. I can post the CSS on a server for the theme and child theme if that works.
  
  Thanks,
  Dave
• kavin March 2012

  How are you previewing the Print styles? Like Web developer toolbar or similar?
  
  If yes, can you please help me out with a screenshot of Firebug or chrome inspector?
  
  Just to be clear,
  1) Right click on the first tab contents, Inspect element -> HTML tab.
  2) Make sure the ui-tabs-panel div is selected in the html View.
  3) Please take a snap for me. :)
• dwolverton March 2012

  I have the screen captures posted in a .zip file:
  http://www.mediawerx.com/clients/samples.zip
• kavin March 2012

  I've updated the code - http://pastebin.com/nZHyHfHv. Please try and let me know.
• dwolverton October 2012

  Hi Kavin,
  
  Okay, this project was on hold for awhile. I now have a test page posted here:
  http://afcfs.com/porte-cocheres2/
  The tab formatting for print is working well. Is there a way to print the content of all the tabs? Right no it is only printing the tab that is selected.
  
  Thanks,
  Dave