absolute position elements not resizing properly

[GroovyMotion]

I have 3 blocks that have 33.333% width that are absolute positionned. The whole layout is responsive except those boxes.
I tried the trick from @Paulie_D about translate but it didn’t work.

Here is the pen, check in full-size or else in the regular pen you can’t see the whole layout.

http://codepen.io/GroovyMotion/full/vesfL

Thanks in advance!

[Paulie_D]

Absolute positioning has its uses but using it for layout is, IMO, not generally a good idea.

There are much better and more flexible layout methods I would use in preference.

[GroovyMotion]

Thanks Paulie_D but my issue is that I use a background image.
what would be another way to use the background image without absolute position?

[Paulie_D]

I’m not sure what the bg image has to do with it…are you specifically aligning the divs to the image?

[GroovyMotion]

Yes I want to align the elements according to the bg image

[Alen]

Something like this?
http://codepen.io/alenabdula/pen/tvwFo

[GroovyMotion]

@Alen thanks a lot this is much better/flexible than my own version! :)

@Paulie_D sorry man I realized that my old way with floats works perfectly!
edit
The clearfix is screwing out the rest of the layout :(

[Author]

Posts