This topic is locked
[SOLVED]

 Tab Wrapping

10/7/2013 3:24:28 AM
PHPRunner General questions
J
JER author

There have been a few posts on the forum seeking info on how to control the wrapping of tabs and responses citing additional control on menu design in 6.1 onwards..however I'm afraid I can't find a solution.
The issue is that while all the add and view menus I create wrap the sub-tabs to available display width, the edit one doesn't.
I have examined the raw HTML in and around $TabGroup tags in visual editor but cannot see any obvious difference between the add/view style/layout and the edit.
I have ticked the resizing control on the misc control tab but I cannot see this making any difference.
Version 6.2 build 16275
Can you help please?
Many thanks

Sergey Kornilov admin 10/7/2013

Could you post a screenshot here that explains how it works and how you need it to work?

J
JER author 10/7/2013



Could you post a screenshot here that explains how it works and how you need it to work?


In Add and View screens the tabs wrap to fit the available (but fixed) width.



In the Edit screen PHPR generates wide table without wrap that is wider than the screen width although the layout template is set to the default 100%.

Scroll is available but no window resize.



Clearly I am after knowing how to control the wrapping.
Thanks

Sergey Kornilov admin 10/7/2013

Thanks, screenshots help. So, which page is the one that you need to modify? Do you want to make Edit page narrow or Add/View pages wide?

J
JER author 10/7/2013



Thanks, screenshots help. So, which page is the one that you need to modify? Do you want to make Edit page narrow or Add/View pages wide?


I would like to make the edit page narrow.
But really, understanding where the wrap is being set/controlled is what would be good to document for everyone.
I suppose I'm also unsure why the misc setting of resizable doesn't seem to have any effect.
Thanks again.
James

Sergey Kornilov admin 10/8/2013

James,
'resizable columns' option only applies to the List page. With this option turned on end user can change columns width right in the web browser.
To achieve what you looking for open open generated pagestyles\edit2.css file in the output directory, find and remove the following code

.page-edit2 .runner-b-editfields, .page-edit2 .runner-b-editfields,

.page-edit2 .runner-b-editfields, .page-edit2 .runner-b-editfields > *,

.runner-pagewrapper .page-edit2 .runner-b-editfields, .page-edit2 .runner-b-editfields,

.runner-pagewrapper .page-edit2 .runner-b-editfields, .page-edit2 .runner-b-editfields > *,

.runner-pagewrapper .runner-pagewrapper .page-edit2 .runner-b-editfields, .page-edit2 .runner-b-editfields,

.runner-pagewrapper .runner-pagewrapper .page-edit2 .runner-b-editfields, .page-edit2 .runner-b-editfields > *

{

white-space: nowrap;

}
J
JER author 10/10/2013

That was it!

Thanks

James