0 Replies Latest reply on Feb 7, 2010 10:21 PM by martcol

    Help With converting px to em...

    martcol Level 4

      So, I thought that I would have a go at converting a site from all px to em to help with accessibility and using browser zoom.  I wish I'd never started!


      This is how I approached it.


           1) Set my font to 100%

           2) Change all font sizes to em

           3) Feel smug

           4) Notice that after a couple of ramps up on the zoom the layout goes pear-shaped

           5) Change all width/height dimensions to em

           6) Change all padding/margin dimensions to em

           7) Feel a little tearful

           8) Realise I don't have a back-up style sheet

           9) Re-draw WWW domination plan

           10) Start to make a little progress

           11) Try out the negative zoom

           12) See that screw my layout - don't understand it

           14) Add some min-width/min-height rules

           12) Feel a little tearful...

           13) Came here to be with friends


      I worked out I think, that using flexible units in a fixed environment is going to cause problems.


      I'm having trouble with layout more than text-size.  I think the only thing that will cause me grief with text-size is with nested element and the way that em is inherited but, the site is quite straight forward, apart from a few floated elements.


      I thnk my main problems are with the layout:  Images, background images and how to approach the whold width/height thing.




      PS I won't be at my PC for a while so, if  you respond and I don't come back to you, it's not because I'm not interested.  I'm too ashamed and confused to post a live page!