Print Style Sheet - Not all content from jquery tabs is showing up

I have tabs set up using jquery and am using display:inline-block !important; to override the inline element display:none.  This does work, but instead of getting a page break when the content reaches the end of the page it just doesn't show up. Well at least not in firefox.  It shows up in safari, and in ie I get a scrollbar, but still not all the content.  

I've tried page break, overflow and a number of other things, but I'm just not having any success pinpointing the problem.

To view the site live go to: http://www.massagecenters.webbdemo.com/services

Thanks for the help!
Jules
LVL 2
Jules WebbFreelance Web DeveloperAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

remorinaCommented:
Hi JulesWebb,

Try adding the below css class to the end of your print.css
#bd {overflow:visible;padding:0;}

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Jules WebbFreelance Web DeveloperAuthor Commented:
Thanks remorina

That did help, but there is still content missing on page 2 of the print preview.  I checked some of the other pages that use the tabs and they all seem to have the same problem.  Can you please take another look for me?

Thanks!
Jules
0
remorinaCommented:
Hi JulesWebb,
Unfortunately I'm unabvle to track it further on my PC since I don't have an offline version for the site and one saved locally isn't complete and looks like it misses some other css files or scripts.

You can follow my method in tracking what's causing this and it wouldn't take you minutes to figure out what's causing it.

I start disabling the css files being loaded, like styles.css, and check the print, if everything is fine then there is a class in styles.css not being reversed in print.css
Then I start deleting chunks of css lines and check which part is affecting the desired area then narrow it down till I get hold of the single class that when removed it would be working fine.
Then finally you can reverse the properties of this class in the print.css.
This was exactly what I've done to get you the above solution.

Hope this helps you tracking it down.
0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

Download your Guide
Jules WebbFreelance Web DeveloperAuthor Commented:
Thanks for the tip! I tracked it down immediately:-)  All I needed to do was add margin:0; to the css you initially suggested.

Cheers!
jules
0
Jules WebbFreelance Web DeveloperAuthor Commented:
Thanks for your help!
0
remorinaCommented:
Great, so it was more useful than just fixing the issue ;)

Best of luck
Remon
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
CSS

From novice to tech pro — start learning today.