Overflow auto on "screenlet-body" into main.css

What about insert into main.css for the property screenlet-body the overflow auto, so in this case we will have the horizontal scrolling in case the content inside a screenlet-body overflow horizontally the screen.
For example into the Store-> Shipping Estimated the table goes outside the screen and it cause a ugly effect, instead put on the css the overflow it will not happen.
What did you think of this change ?

Thanks
Marco

[Adrian Crum]

Marco,

It would be best to use the overflow attribute on a case-by-case basis. Adding it to the screenlet
or screenlet-body styles throws off the layout on screens that don't need it.

In other words, create a style for the particular element, then apply that style to the element.
Small "fixup" styles like that can be used inline - see the Webtools main.ftl file for an example.
Or for screen widgets, you can create a component-specific style sheet - see the Party Manager
partymgr.css file.

-Adrian

[hidden email] wrote:

> What about insert into main.css for the property screenlet-body the overflow auto, so in this case we will have the horizontal scrolling in case the content inside a screenlet-body overflow horizontally the screen.
> For example into the Store-> Shipping Estimated the table goes outside the screen and it cause a ugly effect, instead put on the css the overflow it will not happen.
> What did you think of this change ?
>
> Thanks
> Marco
>
>

[David E Jones]

As a general style I'd rather see wrapping than overflow with a scroll  
bar, as intentional though as it's not really possible/easy/default  
sometimes with HTML. That mean more work on those building pages  
though....

Any other thoughts from others on the general preferred approach?

-David


On Jan 2, 2008, at 1:53 PM, Adrian Crum wrote:

> Marco,
>
> It would be best to use the overflow attribute on a case-by-case  
> basis. Adding it to the screenlet or screenlet-body styles throws  
> off the layout on screens that don't need it.
>
> In other words, create a style for the particular element, then  
> apply that style to the element. Small "fixup" styles like that can  
> be used inline - see the Webtools main.ftl file for an example. Or  
> for screen widgets, you can create a component-specific style sheet  
> - see the Party Manager partymgr.css file.
>
> -Adrian
>
> [hidden email] wrote:
>
>> What about insert into main.css for the property screenlet-body the  
>> overflow auto, so in this case we will have the horizontal  
>> scrolling in case the content inside a screenlet-body overflow  
>> horizontally the screen.
>> For example into the Store-> Shipping Estimated the table goes  
>> outside the screen and it cause a ugly effect, instead put on the  
>> css the overflow it will not happen.
>> What did you think of this change ?
>> Thanks
>> Marco
>

Hi Adrian,

the problem is that we didn't know previously when the browse overflow the page it depends from many parameters:
- type of browser
- resolution of display

So it's not easy to know in which forms the overflow will happen and so setting it to be performed automatically it cannot cause any problem.

An example on what I want to do is visible here:
https://www.ofbiz.it/catalog/control/EditProductStoreShipmentCostEstimates?productStoreId=9000

instead the wrong behaviour is here:

https://demo.hotwaxmedia.com/catalog/control/EditProductStoreShipmentCostEstimates?productStoreId=9000

so if we set the overflow auto the browse will scroll horizontally when the browser need it.

What did you think of this ?

Thanks
Marco
-----

Marco,

It would be best to use the overflow attribute on a case-by-case basis. Adding it to the screenlet or screenlet-body styles throws off the layout on screens that don't need it.

In other words, create a style for the particular element, then apply that style to the element. Small "fixup" styles like that can be used inline - see the Webtools main.ftl file for an example. Or for screen widgets, you can create a component-specific style sheet - see the Party Manager partymgr.css file.

-Adrian

[hidden email] wrote:

What about insert into main.css for the property screenlet-body the overflow auto, so in this case we will have the horizontal scrolling in case the content inside a screenlet-body overflow horizontally the screen.
For example into the Store-> Shipping Estimated the table goes outside the screen and it cause a ugly effect, instead put on the css the overflow it will not happen.
What did you think of this change ?
Thanks
Marco

[Adrian Crum]

David,

There are some combinations of HTML elements that don't "wrap" -

https://127.0.0.1:8443/webtools/control/availableServices

-Adrian

David E Jones wrote:

>
> As a general style I'd rather see wrapping than overflow with a scroll  
> bar, as intentional though as it's not really possible/easy/default  
> sometimes with HTML. That mean more work on those building pages  
> though....
>
> Any other thoughts from others on the general preferred approach?
>
> -David
>
>
> On Jan 2, 2008, at 1:53 PM, Adrian Crum wrote:
>
>> Marco,
>>
>> It would be best to use the overflow attribute on a case-by-case  
>> basis. Adding it to the screenlet or screenlet-body styles throws  off
>> the layout on screens that don't need it.
>>
>> In other words, create a style for the particular element, then  apply
>> that style to the element. Small "fixup" styles like that can  be used
>> inline - see the Webtools main.ftl file for an example. Or  for screen
>> widgets, you can create a component-specific style sheet  - see the
>> Party Manager partymgr.css file.
>>
>> -Adrian
>>
>> [hidden email] wrote:
>>
>>> What about insert into main.css for the property screenlet-body the  
>>> overflow auto, so in this case we will have the horizontal  scrolling
>>> in case the content inside a screenlet-body overflow  horizontally
>>> the screen.
>>> For example into the Store-> Shipping Estimated the table goes  
>>> outside the screen and it cause a ugly effect, instead put on the  
>>> css the overflow it will not happen.
>>> What did you think of this change ?
>>> Thanks
>>> Marco
>>
>>
>

At this address you find the same example with the auto overflow.

https://www.ofbiz.it/webtools/control/availableServices

Marco



-----
David,

There are some combinations of HTML elements that don't "wrap" -

https://127.0.0.1:8443/webtools/control/availableServices

-Adrian

David E Jones wrote:

As a general style I'd rather see wrapping than overflow with a scroll  bar, as intentional though as it's not really possible/easy/default  sometimes with HTML. That mean more work on those building pages  though....
Any other thoughts from others on the general preferred approach?
-David
On Jan 2, 2008, at 1:53 PM, Adrian Crum wrote:
Marco,

It would be best to use the overflow attribute on a case-by-case  basis. Adding it to the screenlet or screenlet-body styles throws  off the layout on screens that don't need it.

In other words, create a style for the particular element, then  apply that style to the element. Small "fixup" styles like that can  be used inline - see the Webtools main.ftl file for an example. Or  for screen widgets, you can create a component-specific style sheet  - see the Party Manager partymgr.css file.

-Adrian

[hidden email] wrote:

What about insert into main.css for the property screenlet-body the  overflow auto, so in this case we will have the horizontal  scrolling in case the content inside a screenlet-body overflow  horizontally the screen.
For example into the Store-> Shipping Estimated the table goes  outside the screen and it cause a ugly effect, instead put on the  css the overflow it will not happen.
What did you think of this change ?
Thanks
Marco

[Adrian Crum]

Marco,

That is the example I'm using to test your proposal. True, it fixes the problem in that screen, but
applying that property to ALL screenlets breaks the layout in other screens.

Maybe we could have a "scrollbars" style decorator in the main style sheet, so that screenlets that
have overflowing contents could use <div class="screenlet scrollbars">, or widget version <container
style="screenlet scrollbars">. (There's an issue in the widget case though - we're introducing an
HTML "fix" into a "rendering agnostic" environment.)

-Adrian

[hidden email] wrote:

> At this address you find the same example with the auto overflow.
>
> https://www.ofbiz.it/webtools/control/availableServices
>
> Marco
>
>
>
> -----
> David,
>
> There are some combinations of HTML elements that don't "wrap" -
>
> https://127.0.0.1:8443/webtools/control/availableServices
>
> -Adrian
>
> David E Jones wrote:
>
> As a general style I'd rather see wrapping than overflow with a scroll  bar, as intentional though as it's not really possible/easy/default  sometimes with HTML. That mean more work on those building pages  though....
> Any other thoughts from others on the general preferred approach?
> -David
> On Jan 2, 2008, at 1:53 PM, Adrian Crum wrote:
> Marco,
>
> It would be best to use the overflow attribute on a case-by-case  basis. Adding it to the screenlet or screenlet-body styles throws  off the layout on screens that don't need it.
>
> In other words, create a style for the particular element, then  apply that style to the element. Small "fixup" styles like that can  be used inline - see the Webtools main.ftl file for an example. Or  for screen widgets, you can create a component-specific style sheet  - see the Party Manager partymgr.css file.
>
> -Adrian
>
> [hidden email] wrote:
>
> What about insert into main.css for the property screenlet-body the  overflow auto, so in this case we will have the horizontal  scrolling in case the content inside a screenlet-body overflow  horizontally the screen.
> For example into the Store-> Shipping Estimated the table goes  outside the screen and it cause a ugly effect, instead put on the  css the overflow it will not happen.
> What did you think of this change ?
> Thanks
> Marco
>
>
>
>
>