Position fixed puts the DOM element out of the flow. Being out, it can't inherit from other to set its box model parameters. 

That's why it's trying to set its width based on its content rather than full width. Forcing full width do the job. Then you get a z-index issue so you have to increase it too.

Code could be
<div class="toolbar" style="width:100%;position:fixed;z-index:99">

Working exemple: http://jsfiddle.net/VK374/

Remi

De: Atanu Shome
Envoyé: jeudi 17 avril 2014 08:12
À: iphonewebdev@googlegroups.com
Répondre à: iphonewebdev@googlegroups.com
Objet: Re: Demo Image like footer and fixed header - iUi

Thank you for your reply. And thanks for informing about the footer. I've already tried position fixed and that is breaking the style. Like this http://jsfiddle.net/LkgpX/240/

On Wednesday, April 16, 2014 5:30:55 PM UTC+6, Remi Grumeau wrote:
The topbar, by default, has position: absolute, which means it keeps its position at a 0,0 position on the layout.

You can change to position: fixed in the css, so it's fixed on the screen.

Bottom bar you see is the navigator one (Safari) :)

Remi

De: Atanu Shome
Envoyé: mercredi 16 avril 2014 12:52
Objet: Demo Image like footer and fixed header - iUi

I want to use iUi to convert one of my cordova app to iphone look. I want a fixed header like jquery mobile. Is there any property in iUi for this?

And there is footer in most images on the documentation. Like here http://www.iui-js.org/documentation/latest/getting-started.html in the first mobile UI image there is a small blue footer. I can't footer in any of the example files after download. How to activate that footer and use that. Am I missing something?

--
You received this message because you are subscribed to the Google Groups "iPhoneWebDev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to iphonewebdev...@googlegroups.com.
To post to this group, send email to iphone...@googlegroups.com.
Visit this group at http://groups.google.com/group/iphonewebdev.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "iPhoneWebDev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to iphonewebdev+unsubscr...@googlegroups.com.
To post to this group, send email to iphonewebdev@googlegroups.com.
Visit this group at http://groups.google.com/group/iphonewebdev.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "iPhoneWebDev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to iphonewebdev+unsubscr...@googlegroups.com.
To post to this group, send email to iphonewebdev@googlegroups.com.
Visit this group at http://groups.google.com/group/iphonewebdev.
For more options, visit https://groups.google.com/d/optout.

Reply via email to