Click here to Skip to main content
Rate this: bad
good
Please Sign up or sign in to vote.
See more: Ajax tabs
Currently there are lot of tab panels(20) inside my tab container. As a result once i run the site, a horrizontal scrollbar apears on the webpage.
Is there a way to shift the remaining tabs to next line so that no scroll bar appears?
Posted 25-Feb-10 19:37pm
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 3

Use this in css:
<style type="text/css">

.ajax__tab_default .ajax__tab_header /* this makes the tabs wrap*/
{
white-space: normal!important;
}
</style>
  Permalink  
Comments
Member 3692586 at 9-Dec-11 8:50am
   
Yes. This does work satisfactorily. Thanks
RaisKazi at 27-Jul-12 17:18pm
   
My 5!
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 1

I believe there must be an option to have fix width of the tab container. Thus on addition of new panels it would not grow. Try that.
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 2

I tried setting Tab container's Width to some value but it just sets the width of the tab panel not the actual container. Any other suggestion?
  Permalink  
Rate this: bad
good
Please Sign up or sign in to vote.

Solution 4

.ajax__tab_default .ajax__tab_header /* this makes the tabs wrap*/
{
white-space: normal!important;
}
 

It is working fine. but the problem is it looks weird if the tab line comes to the next line.
  Permalink  

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



Advertise | Privacy | Mobile
Web01 | 2.8.141220.1 | Last Updated 11 Jun 2010
Copyright © CodeProject, 1999-2014
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100