APEX Tab Display

My application has 11 tabs which has become more than I originally anticipated. The amount of tabs has caused the page to scroll way too far to the right and is really making the GUI look ridiculous. While the application is functioning perfectly I cannot release this version into production without taking care of the interface. Is there a way to split the one, long row of tabs into 2 rows of tabs. This way I'd be able to have the top row of tabs pertaining to forms and the bottom row of tabs pertaining to reports. I know this seems silly but I really don't know how to take care of this problem. Please help because it will be greatly appreciated. Thanks in advance.

There was an answer to this exact question recently. I think it may have been by ATD. It had something to do with editing the template and using a bit of css to cause the tabs to float left or something.
I cannot find the post, but maybe you will have better luck.
EDIT: Found the thread:
Re: Create second row of tabs under the tabs already created
Edited by: JohnA on Sep 16, 2008 2:01 PM

Similar Messages

How easy is it to create a new add on? I would like to see tabbed display within the browser on FF24 on Android 4.2 – as per desktop FF

Please excuse this if it's a noob Q – I am, indeed, completely new to Android. Tabbed display appears to have been possible on previous versions of FF for Android via several add ons but unfortunately no more. Display of each open tab within the browser – rather than the current arrangement with just the number in the corner – is still possible with FF desktop and also features in Chrome, Opera and Dolphin for Android. I would prefer not to use these other mobile browsers as FF outperforms them but I do need tabbed display to allow for PDF docs to open – using the PDF viewer add on – alongside their initiating webpage. Any ideas? Is it difficult to create an add on? What is the process? Is one in the pipeline? Many thanks in advance for any help or guidance you can offer...

Many thanks for your reply, Waka – guess you're right that it's a new add on or bust... I still find it odd that such a common UI feature across mobile browsers is unavailable in FF24 either as an option under settings or as an add-on. Surely, I'm not the only person who finds this puzzling?

Spry Tabs displaying all content in IE8

Hi,
I have been looking at using the spry tabs panel to display content, it works perfectly fine in Safari and Firefox, but in explorer 8 all the panels display one underneath the other?
I have played around with the layout and am probably out of my depth...
If anyone knows a way I can fix this, otherwise I will use a simpler display.
Thanks
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="CSS/css.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<script type="text/javascript">

</script>
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="TabbedPanels1" class="TabbedPanels">
    <ul class="TabbedPanelsTabGroup">
      <li class="TabbedPanelsTab1">
      <h1>$500 </h1>
     <p> Starter pack.</p>
      </li>
      <li class="TabbedPanelsTab" >
<h1>$900 </h1>
        <p>A bit more special.</p>
      </li>
      <li class="TabbedPanelsTab">
<h1>Custom </h1>
        <p>For something extra.</p>
      </li>
      <li class="TabbedPanelsTab">
        <h1>Design Services</h1>
        <p>content.</p>
      </li>
      </li>
    </ul>
    <div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent1">
      <div class="contentimage"><img src="images/page-design.gif" width="400" height="312" alt="example of designs" longdesc="images/page-design.gif" /></div>
      <div id="content">
<ol>
<li>option 1.</li>
                    <li>option 2.</li>
              <li>option 3.</li>
              <li>option 4.</li>
              <li>option 5.</li>
                </ol>
<p>Create an interesting space.</p>
<div align="center"><a href="web me.html#pageinfo"><img src="images/auckland-design.gif" width="314" height="62" alt="link to design packages" longdesc="images/auckland-design.gif" /></a></div>
      </div>
</div>
<div class="TabbedPanelsContent2">
      <div class="contentimage"><img src="images/site-design.gif" width="400" height="310" alt="example of design" longdesc="images/site-design.gif" /></div>
      <div id="content">
<ol>
<li>option 1.</li>
                    <li>option 2.</li>
              <li>option 3.</li>
              <li>option 4.</li>
              <li>option 5.</li>
                </ol>
<p>Create an interesting space.</p>
      <div align="center"><a href="web me.html#info"><img src="images/auckland-design.gif" width="314" height="62" alt="link to design packages" longdesc="images/auckland-design.gif" /></a></div>
      </div>
</div>
<div class="TabbedPanelsContent3">
     <div class="contentimage"><img src="images/site-design.gif" width="400" height="310" alt="example of design" longdesc="images/site-design.gif" /></div>
      <div id="content">
<ol>
<li>option 1.</li>
                    <li>option 2.</li>
              <li>option 3.</li>
              <li>option 4.</li>
              <li>option 5.</li>
                </ol>
<p>Create an interesting space.</p>
      <div align="center"><a href="web me.html#info"><img src="images/auckland-design.gif" width="314" height="62" alt="link to design packages" longdesc="images/auckland-design.gif" /></a></div>
      </div>
</div>
<div class="TabbedPanelsContent4">
      <div class="contentimage"><img src="images/site-design.gif" width="400" height="310" alt="example of design" longdesc="images/site-design.gif" /></div>
      <div id="content">
<ol>
<li>option 1.</li>
                    <li>option 2.</li>
              <li>option 3.</li>
              <li>option 4.</li>
              <li>option 5.</li>
                </ol>
<p>Create an interesting space.</p>
      <div align="center"><a href="web me.html#info"><img src="images/auckland-design.gif" width="314" height="62" alt="link to design packages" longdesc="images/auckland-design.gif" /></a></div>
      </div>
</div>
    </div>
</div>
<div id="design">
<div class="topline"></div>
<div id="leftcoloumn">
<h1> Simple affordable website design in Auckland</h1>
     <p>As designers on Auckland's North Shore we set out to offer an affordable easy way to create special spaces etc..</p>
    </div>
<div class="centerline"></div><div id="rightcoloumn">
    <h1>Specialising in creating special spaces. </h1>
   <ol>
      <li>Create a space you'll love.</li>
      <li>Fit your budget.</li>
                         </ol>
    </div>
</div>
<div id="footer">
</div>
</div>
<script type="text/javascript">

</script>
</body>
</html>
@charset "UTF-8";
.TabbedPanels {
margin: 0px;
padding: 0px;
float: left;
clear: none;
width: 100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
#container #TabbedPanels1 .TabbedPanelsTabGroup .TabbedPanelsTab1 h1 {
font-size: 18px;
color: #52542D;
#container #TabbedPanels1 .TabbedPanelsTabGroup .TabbedPanelsTab h1 {
font-size: 18px;
color: #52542D;
.TabbedPanelsTabGroup {
margin: 0px;
padding: 0px;
margin-left: 30px;
.TabbedPanelsTab {
position: relative;
top: 435px;
float: left;
width: 203px;
padding: 12px 10px;
margin: 0px 1px 0px 0px;
background-color: #CCC;
list-style: none;
-moz-user-select: none;
-khtml-user-select: none;
cursor: pointer;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-right-color: #666633;
border-bottom-color: #666633;
border-left-color: #CCC;
overflow: visible;
.TabbedPanelsTab1 {
position: relative;
top: 435px;
float: left;
width: 203px;
padding: 12px 10px;
margin: 0px 1px 0px 0px;
background-color: #CCC;
list-style: none;
-moz-user-select: none;
-khtml-user-select: none;
cursor: pointer;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-right-color: #666633;
border-bottom-color: #666633;
border-left-color: #666633;
overflow: visible;
.TabbedPanelsTabHover {
background-color: #FFF;
.TabbedPanelsTabSelected {
background-color: #FFF;
border-bottom: 1px solid #666633;
.TabbedPanelsTab a {
color: black;
text-decoration: none;
.TabbedPanelsContentGroup {
position: relative;
bottom: 90px;
clear: both;
min-height: 430px;
height: auto;
margin-right:27px;
margin-left: 30px;
background-image: url(../images/content-box.gif);
background-repeat:no-repeat;
.TabbedPanelsContent {
padding: 4px;
.TabbedPanelsContentVisible {
.VTabbedPanels .TabbedPanelsTabGroup {
float: left;
width: 10em;
height: 20em;
background-color: #EEE;
position: relative;
border-top: solid 1px #999;
border-right: solid 1px #999;
border-left: solid 1px #CCC;
border-bottom: solid 1px #CCC;
.VTabbedPanels .TabbedPanelsTab {
float: none;
margin: 0px;
border-top: none;
border-left: none;
border-right: none;
.VTabbedPanels .TabbedPanelsTabSelected {
background-color: #EEE;
border-bottom: solid 1px #999;
.VTabbedPanels .TabbedPanelsContentGroup {
clear: none;
float: left;
padding: 0px;
width: 30em;
height: 20em;
#container #content {
width: 395px;
float: right;
margin-top: 35px;
padding-right: 20px;
#container #TabbedPanels1 .TabbedPanelsContentGroup .TabbedPanelsContent1.TabbedPanelsContentVisible #content .image {
margin-top: 27px;
#container .contentheaders {
margin-right: 8px;
#container .contentimage {
float: left;
margin-top: 35px;
padding-left: 40px;

You are probably getting a javascript error in IE8 preventing the tabs displaying properly. Use the developer tools unde F12 to find the problem line in your code. Sometimes it is just a cariable name you have used that IE does not like....

When i share a contact from my iphone and sent it to any other iphone the information within the notes tab displays in correctly

When i share a contact from my iphone and sent it to any other iphone the information within the notes tab displays incorrectly,
.I usually use this tab for doctors and allergies

I just attempted the share myself with a contact and found it did not transmit the notes field either. I've only used this method for sharing maybe twice since I've had my iPhones. I don't remember if it ever worked before, and then I wouldn't know why it wouldn't. Sorry I couldn't help any more than that.

When I open about this mac - more info and I switch through the tabs (display,memory,storage,support,service) it lags (fps drops, animation looks choppy not smooth). Why does this happen? (over 300 gb free,same programs installed,free desk-downloads)

When I open about this mac -> more info and I switch through the tabs (display,memory,storage,support,service) it lags (fps drops, animation looks choppy not smooth) even though all the mac (programs , interface ) works smooth . Why does this happen? (over 300 gb free,same programs installed,free desktop-downloads -no garbage there- everything neat and tidy.) Need some help. Only there it the animations goes like 2 fps and is not smooth. I do not understand why because the programs are the same so its the usage. Nothing is changed, yet i experience this little issue for a couple of days.

OK, I'm confused. When I do About this Mac > More Info in OS10.9, I don't see any animation other than the window resizing. Is that the animation you are describing?
Which if any of the following apply to your computer:
1) Are you running any anti-virus/internet security applications?
2) Are you running any "cleaning/tune-up/optimizations" applications?
3) Any peer-to-peer or torrent downloading software?
4) Any third-party disk backup software that came bundled with an external hard drive?
5) Any online backup scheme other than iCloud (Carbonite; GoogleDrive; MS One Drive)?
6) Did your financial institution ask you to install Trusteer EndPoint Protection (also known as Trusteer Rapport)?

Drop down menu is a small square and no tab display.

Hey, my tab display is gone, my drop down menu's won't open, such as file, edit, view, history etc.
I have no idea what's going on, I don't want to lose my bookmarks and I can't import them into IE atm.
Any help would be great, if I have to re-install is there a manual way to get bookmarks without going into the menu bookmarks and manage/export?
Thanks.

I have the same trouble with Firefox v.24.0 It occurs on Windows XP, Windows 7 Pro, and Windows 7 Enterprise.
@foodie2 - your workaround definitely works and is far less painful than changing settings which could affect other sites. Great idea!

How to customize what new tabs display (Universal work list)

Hello, Expert!!
Please let me ask about subject.
I made new tabs by customizing at "Universal Worklist Content Configuration", and then,
I would like to customize what new tabs display.
(Ex. Tab1 displays the document that subject name includes "Abc", or Tab2 displays the document that is sent within 5 days,, so on)
Please could anyone let me know how to customize above!!
Thanks
/Yusuke

Thanks,
While trying that with the Tcode sm30 Iget the msg : The maintenance dialog for RSADMINA is incomplete or not defined
How can I solve this ?
Edited by: Youness NAJI on Jan 22, 2010 2:47 PM

Access web page with alternate tab displayed by default

I have a WebHelp project with a start page that displays the
Contents tab by default. Is there a way through the URL to have a
different tab (e.g., the Search tab) display by default? Thanks.
Tim

I need a way to open the same WebHelp project with the
Contents tab displayed by default if the project is accessed
through one method or with the Search tab displayed by default if
the project is accessed through another method. I am using RoboHelp
X5.0.2.
Peter, I generated my project with the Search tab set as
default. I viewed the start page, and the Search tab was correctly
displayed by default. I made a copy of this start page and saved it
to a different folder location. I regenerated my project with the
Contents tab set as the default. I copied the alternate start page
into the project so that I essentially had a start_contents.htm
page and a start_search.htm page. This method was ineffective. Both
the start_contents.htm page and the start_search.htm page now open
with the Contents tab displayed by default.
Is there a way through the URL to be able to specify the tab
to display by default (sometimes the Contents tab and sometimes the
Search tab) for the same help project, either through using
multiple start pages (which in my test appears to be ineffective)
or through additional code in the URL itself?

Index tab displays no keywords

RoboHelp for Word Version 5
When RoboHelp broke our Help (images did not display), we rolled back to 5 to meet our deadline and troubleshoot later.
WinHelp works as before; however, now when we compile WebHelp, the Index tab displays no keywords below the word wheel.
When I type in the word wheel, I see some keywords in a popup list, but when I select a keyword, it neither appears in results below nor displays the relevant topics to the right.
Please help.

Hi aecspades and welcome to the RH community.
This could be because the index keywords have not be added to the project's index file. If you go into your project settings (File > Project Settings) you'll find an option there which I bet is set to add keywords to the topics. For the index tab to display you must have keywords added to the HHK file.
The RoboColum(n)
@robocolumn
Colum McAndrew

Apex tab and page display query

I am using Apex 4.1
I have the following tabs set up.
Home, Tab 1,Tab 2 and so on
The home page is fine. Now the query is with regard to Tab 1. I need it to display Page 3 or Page 4 based on the location of APP_USER
The region details are all stored in the table : employee_info
How can I check or display Page 3 if the Region is APAC and Page 4 if EMEA(APAC and EMEA being values in table)
Is there some way how I can set or achieve this? The default page I have set is as of now Page 3 but it has to pick Page 3 or 4 based on region value from employee table.
Any guidance will be appreciable.
Thanks,
Swetha

LKSwetha wrote:
I am using Apex 4.1
I have the following tabs set up.
Home, Tab 1,Tab 2 and so on
The home page is fine. Now the query is with regard to Tab 1. I need it to display Page 3 or Page 4 based on the location of APP_USER
The region details are all stored in the table : employee_info
How can I check or display Page 3 if the Region is APAC and Page 4 if EMEA(APAC and EMEA being values in table)
Is there some way how I can set or achieve this? The default page I have set is as of now Page 3 but it has to pick Page 3 or 4 based on region value from employee table.
Any guidance will be appreciable.Create 2 copies of Tab 1, one for page 3 and the other for page 4. Display them conditionally according to the user region.

APEX tabs do not appear in some browsers (after 5)

I am using APEX 4.2 to build a fairly simple application. I am pretty new to this, but I noticed the following:
I use standard level1 tabs and I noticed that depending on the browser I use I can only see a maximum of 5 tabs. It just does not display the tabs after 5. I of course cleaned browser cache, etc .. to no avail.
These are observations based on available browsers: I CANNOT see more than 5 tabs in IE or Firefox 24, but I CAN in Firefox 17 AND Google Chrome.
Can anyone let me know if I can correct a setting somewhere to make all tabs appear in all browsers.
Thanks.

tardo wrote:Actually, those specific applications don't come with .desktop files, which is your problem (this will happen to everyone too). Only solution is to create one yourself, or google for one. If you find them, ask the maintainers to include them in the pkg.
I don't agree with you. 2 days ago i had to reinstall my system because of a pacman problem. Before this, some applications i use used to have .desktop files. After reinstallation they don't. And also they were not upgraded. Maybe the problem is mirrors, that's not a big problem

Sales Analysis Item Tab Displays Zero Dollars for "Orders"

This pertains to SAP B1 SP 00 PL 16 Version 8.8.
While doing the Sales Analysis function under Sales A/R > Sales Reports > Sales Analysis > Item Tab, the system does not report on the dollars for the day when I select "Orders" or "Delivery Notes'. The system does display the proper dollars when I select "Invoices" on the "Item" Tab.
And the "Invoices" and "Orders" and "Delivery Notes" buttons display correct dollars on the other tabs for Customer and Sales Employee...so why not on the "Items" tab??? Strange that a button would be displayed which does not work...
Does anyone know why this might be happening and/or how to fix this???
Does SAP plan on fixing this in any upcoming patch levels???
Regards - Zal
Responses received from SAP B1 Core Forum:
Sales Analysis Item Tab Function Not Showing Orders Dollars

Thanks for the quick reply Gordon - hope things are continuing to go well in your new endeavors &;-D
Well that is really strange that items is handled that way - I have created SQL to get the results but I always like to balance out to what SAP B1 is reporting. My SQL detail and grand totals are fine by Customer and I have been able to reconcile in that manner, but wanted to reconcile by items also. I am certain I have done it before in SAP 2007A...
Has there been a change to the item/sales order table in Version 8.8???
Take care my FFF - Zal

How to define the number of tab displayed in Tab page group

Hello,
I have an application with Tab Page group with 8 tabs and the browser is displaying only 5 of thems. I have to scroll to display the remaining 3 although I have enough spaces on the screen to displayed all of them.
Do you know what parameter/setup I need to change to display all of them at once ?
Thanks for your help,
Manuel

The link is to the closest linkable point in the documentation to the description of the Number of Rows (Item) attribute.
It sounds like you have been trying to enter—unsuccessfully—an item name or substitution string into the Number of Rows attribute. The Number of Rows (Item) attribute is the one that actually allows you to do this. Click on the flashlight icon beside it to get a list of items from the application.

I used to be able to have multiple websites in one new tab display, I can't seem to do that again, help?

A year ago, or so, I updated my Firefox and received the option of when I open a new tab I was able to display several recent tabs. After having to mess with several settings and a rollback to delete an unwanted program I lost this function and have since not been able to recover it. please help? When I opened the new tab it had 9 tiles of recent websites, oh which I could remove from the list or lock into place.

hello, please install the search reset addon - it will revert the some common customizations (including the new-tab-page) in firefox back to the default: https://addons.mozilla.org/firefox/addon/searchreset/

APEX page displays correctly in Firefox but not in IE7 nor IE8

I have an APEX 4.0 page which displays two columns of data. In Firefox, where the border for column one should end, it does. Then the column two data is displayed right next to column one (correctly). In IE, there is a gap of blank space between the columns, which makes it necessary to scroll over to see all the data (incorrect). I did find a post that seemed to address this very issue, however, the suggested fix did not solve the problem for me. The regions are defined as follows:
Sequence 1 - Column 1 - Breadcrumbs region - Breadcrumb region template - Type = Breadcrumb
Sequence 10 - Column 1 - Lot Information - Reports region - Type = HTML Text
Sequence 10 - Column 2 - Burial - Reports region - Type = SQL Query
Sequence 30 - Column 2 - Documents - Reports region - Type = SQL Query (updateable report)
Sequence 40 - Column 2 - Upload Document - Reports region - Type = HTML Text
With the exception of the breadcrumb region, all regions are set to Display Point = Page Template Body (3. items above region contect)
I have tried a number of different combinations between the page template, display points, etc. and have tried different width settings in the html source, but have not been able to remove the gap between the columns.
Does anyone know of a way to resolve this? If you need more information, please let me know. Thank you for any help you can provide.

You could put all but the breadcrumb into a region/subregion setup...
What theme in APEX are you using?
Thank you,
Tony Miller
Webster, TX
While it is true that technology waits for no man; stupidity will always stop to take on new passengers.

APEX Tab Display

Similar Messages

Maybe you are looking for