Orientationchange, footer and class "ui-bar"

[devgmo]

Hi,

There is a problem when you have a footer using the class "ui-bar" (to include padding in the bar for buttons).

When you rotate on landscape and then on portrait again, the content is like 20px too much on the left, so you have a blank on the right. I don't use any personal class and you can reproduce this issue easily.

Of course if you try the same code without the "ui-bar" class, it works...

I am testing on IOS 4 (simulator and real device)

the code of the page :

    <div id="list" data-role="page" data-theme="b"> 

        <div data-role="header" data-position="fixed" data-theme="b"> 
            <h1 id="list-title">List</h1>                       
        </div>
        <!-- /header -->

        <div data-role="content" data-theme="b">
        My content
        </div>
        <!-- /content -->

        <div data-id="footer-fixed" data-role="footer" data-position="fixed" data-theme="b" class="ui-bar">     
            <a id="list-mail" href="#" data-icon="forward" class="footer-btn">Mail</a>
         </div>
         <!-- /footer -->   

      </div>
      <!-- /page --> 

Thanks for your work guys!

[nwhite89]

@devgmo I have been working on this problem to

I done a quick work around which should be ok for you create an extra .css file and add the below. you don't need the last one but I found that the a tag will sit to far to the right.

.ui-bar,.ui-body{
padding:.4em 0px .4em 0px;
}
.ui-bar .ui-controlgroup {
margin: 0 .4em;
}

[jaspermdegroot]

I am closing this issue as duplicate of #3956. This ticket is older, but the other has more activity.