Re: CSS Regions considered harmful

On 24/01/2014 12:10 PM, Alan Gresley wrote:
> On 24/01/2014 9:33 AM, Alan Stearns wrote:
>> On 1/23/14, 2:17 PM, "Håkon Wium Lie" <howcome@opera.com> wrote:
>>
>>> Alan Stearns wrote:
>>>
>>>>> Here's a version that uses page floats:
>>>>>
>>>>>   http://www.wiumlie.no/2014/regions/uc1-float.html
>>>>>
>>>>> It works in Opera 12.16 or thereabouts.
>>>>
>>>> The floats in the max-width: 500px still interact with the content.
>>> It’s
>>>> not a slide-out menu.
>>>
>>> The text gently flows around it. Updated to so that the menu pushes
>>> the content aside when it appears:
>>>
>>>   http://www.wiumlie.no//2014/regions/uc1-float.html
>>
>> That’s looking a bit better. Can you make the bottom button placement
>> adapt to the article length? Right now if the window is tall there’s a
>> whole bunch of white space between the article and the UI, and if the
>> window is short the buttons overlap the article and the content is
>> clipped. I see that you’re using paged overflow, but our demo adapts to
>> the window size and scrolls.
>
> Ah, this is a very similar to a old Opera bug. Instead of dragging down
> the bottom of the veiwport, do it by the any corner or right of left
> edge. Opera stills has problems with Sticky footers.
>
> http://css-class.com/test/demos/sticky-footer1.htm
>
> If you drag the viewport bottom edge down, the sticky footer just hangs
> in the same position. Dragging any corner or the left or right edge of
> the viewport in or out makes the sticky footer sticky again.

The way to make Opera work was by some hack that didn't effect the other 
browsers [1]. A have used a variant of the hack to fix the buggy Opera 
behaviour. Simply give it a height like so.

body { height:100%; } /* Hack to make Opera 12.16 work */

A demo that works.

http://css-class.com/test/bugs/opera/float-bottom-reflow.htm





1. http://css-class.com/test/demos/sticky-footer3.htm



-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/

Received on Friday, 24 January 2014 01:32:36 UTC