Right now i’m programming an complex column based page.
I did design in the Desk view - it’s all cool.
Than, I did my custom thing in the tablet view - it’s all cool.
When I look as a POV user, the resolution stick in desk, than switch in tablet without scaling. IT’S A GOOD THING because I design in PX and place my texts relative to my pictures in PX.
At this point, it’s all good.
But … when I go into Phone Landscape / Phone Portrait problem appears … now the responsivement scale automatically, and don’t stick as the tablet POV.
My problem is that it’s impossible to design my text position in the space. I have to design in PX as the scaling occur in %. I’m screwed
Possible Solution #1) Can I place my text position in a % ?
Possible Solution #2) or … could I choose the have my Phone Landscape & Phone Portrait resolutions sticks like the tablet does. That would really save the day !
See this video cast … http:// cl.ly/1F2y0e351c1i (remove the space)
Thanks for the videos they really helped explain your problem. I think instead of using px for padding/margin of the parent container which px is the only allowed option right now, use % based div spacer for vertical alignment. Use the same value for both line-height and font-size and then since you are using px based rule for the default layout, base your % off of that. For example, if the container is 200px in height and your font is 150px the difference is 25% X .5 for the top padding…which is 12.5% but since you can’y apply that to the container padding, add a div block above the text, give it a class and set its height to 12.5%. Haven’t proven this theory but its a thought.
I’m blown away by what you did ! I see that you really took time to resolve this
I will try to recreate your solution right now. May I PM you if I have other interrogations ?
Now at least, I know it’s feasible so I can not blame anyone else than myself
In my example, the spacer is not actually needed (that was only a suggestion on how to essentially get around not being able to define % based padding or margin, if you really needed it). My example has fixed font-size, i.e. for the 88 its 150px so to control vertical alignment as absolute centered, I simply apply padding top and bottom of 25px. making it 200px, the size I chose for the entire block to be. The containing div scales to fit.
I am looking to vertically center align pieces of text with dynamic line numbers (1, 2, or 3 lines). Using the solutions outlined in this thread, I am only able to align a dynamic lined block of text on either side (top aligned or bottom aligned) rather than vertically center aligned.
