I am building a multi language website on ExtJS, where I have covered all the technical aspects of the multi language aspect.
How would deal with different string lengths? Lets say I design a 160px space for an specific label. That label is 120px long on Spanish, so everything ok with that; but that same label is 200px on Finnish; what would you do? trim that string? expand the original 160px space? What if we are talking about a form with several columns?
1
There is no catch-all solution. The first step is to switch to a different unit. px is useless for text, because some users might have set a minimum font size in their browsers. The only way to adapt your layout to that is to use em for width and height.
And string length is not the only problem. Line height can be an issue too. Many non-Latin scripts need more vertical space.
You cannot resolve this just with code. You have to talk with the translators, and every translation must be tested visually.
I am working on a translation software with ten thousands of users. I talk with translators and developers every day, and I have never seen a layout that fits for all languages from the start. 🙂
BTW, I think this question would fit better on ux.stackexchange.com.