# Problem with: Padding, CSS, and Hflex

connollyst
18

Hey all,

I'm hoping for some help with this little annoyance in ZK.

So, as ZK admits, the default CSS gives every page 5px padding on the left and right. This isn't really ideal for me though, I want my header and footer to span the whole page for sure and, frankly, if I want any part of my page to have 5px padding.. I'll specify that myself.

Alright, so I just override this with "padding: 0" and everything looks good. However, when I start using hflex as ZK suggests I see the Hflex algorithm is assuming there is 5px padding to each side of the body and I'm left with a 10px gap on the right side of my page. If you resize the browser, however, the hflex algorithm correctly recalculates the full width of the page and the 10px disappears. Some other interactions with the page will also initiate a recalculation of the component widths and the 10px will disappear but I haven't nailed down exactly what kind of interactions do this (maybe anything that invalidates a component?).

Anyway, I'm assuming example code isn't necessary here but can provide it if the explanation isn't clear.

It seems to me like something baked into ZK that would require a bug fix rather than there being a work around.. but would love feedback from the community.

Cheer,
Sean

delete retag edit

## 3 Replies

matthewgo
375

Hi Sean,

Are you using 5.0.8?
I found this bug only happen in 5.0.8 and 5.0.9 works well
This is my sample

<zk>
<style>
body{
}
</style>
<grid hflex="1">
<auxheader colspan="4" label="Contributor of ZK International Message(Part)" />
<columns>
<column hflex="4">Language</column>
<column hflex="5">Contributor</column>
<column hflex="2">Charset</column>
<column hflex="3">Comment</column>
</columns>
<rows>
<row>
<label value="Arabic (ar)" />
<label value="Ayman Elgharabawy" />
<label value="iso-8859-6" />
<textbox value="" width="150px" />
</row>
</rows>
</grid>
</zk>

connollyst
18

Hey Matthew,

I was using 5.0.8 and just had a chance to check out 5.0.9, lo and behold, the problem is gone!

Thanks!
Sean

charlie1989
3

Hi Sean and Matthew,

I test both 5.0.11 and 5.0.9 and already have the problem.
But I find it out, I override it in my css file : body{padding:0;}
and it works.

Thanks!

[hide preview]