1. Contracting
    1. General
      1. Brexit
    2. Business / Contracts
      1. Coronavirus Assistance
    3. Accounting / Legal
      1. Umbrella Companies
      2. HMRC Scheme Enquiries
      3. The Future of Contracting
      4. IR35 Reform
    4. Technical
    5. Welcome / FAQs
  2. Social
    1. Light Relief
    2. Social / Events
  • Visitors can check out the Forum FAQ by clicking this link. You have to register before you can post: click the REGISTER link above to proceed. To start viewing messages, select the forum that you want to visit from the selection below. View our Forum Privacy Policy.
  • Want to receive the latest contracting news and advice straight to your inbox? Sign up to the ContractorUK newsletter here. Every sign up will also be entered into a draw to WIN £100 Amazon vouchers!

Resizing fonts

Collapse
X
1 to 10 of 15 Previous 1 2 template Next
Collapse
Reply to Thread
  •  
  • Filter
  • Time
  • Show
Clear All
new posts
1 to 10 of 15 Previous 1 2 template Next
    #1

    Resizing fonts

    FFS

    Total brain blockage

    I want a div, to be a percentage of page width. I want the text in the child divs to get smaller if the page is resized.

    <div style="width:50%; font-size:50%;background-color:#ff0000; color:#ffffff;">
    <div>Some rubbish</div>
    </div>

    As the page is resized, the div gets smaller, the text does not.

    Help me along my merry way, I'm supposed to me on the phones this morning, not messing about with my email sig.
    Knock first as I might be balancing my chakras.
    Tags: None
    #2
    best spend your time on the phone. most folk with any sense (mind you, clients...!!!!!) have html email disabled so your lovingly crafted sig will render in plain text.

    Comment

      #3
      Originally posted by scotspine View Post
      best spend your time on the phone. most folk with any sense (mind you, clients...!!!!!) have html email disabled so your lovingly crafted sig will render in plain text.
      you've been a great help.
      Knock first as I might be balancing my chakras.

      Comment

        #4
        Originally posted by suityou01 View Post
        I want the text in the child divs to get smaller if the page is resized.
        It seems that you want the actual font size of the child div to change as you resize the page. Unless I've misunderstood what you're asking for, I don't think this would be possible without some kind of client-side scripting. Which probably wouldn't be enabled in the vast majority of HTML email clients.

        I'm willing to be proven wrong though - have you ever seen this technique elsewhere without the use of client-side script? If so, pass me a URL and I'll spend a couple of minutes pulling it apart and giving you some pointers.

        Comment

          #5
          If you do it in Flash, everything will resize perfectly.

          HTH.
          Will work inside IR35. Or for food.

          Comment

            #6
            I'd also love to see a solution to this as I don't believe it's workable (to my knowledge) in CSS3. Basically, the scaling (%) is applied differently to fonts than to the box model. The box model will scale to the browser real estate, fonts will scale to the default font value.

            One (clumsy) way around this would be to create a vector image of the text, SVG perhaps, and apply width & height scaling to that. Bit of a hack, but without scripting... not sure it's straightforward at all.

            NF - any ideas?

            Comment

              #7
              With scripting... it would work like this (Snippet adapted from here):
              Code:
              <html>
<head>
<script type="text/javascript">
<!--
function scale()
{
var sizer = "12em";
var smallest = "9px";
var ww = document.body.clientWidth;
var aim = ww / (parseInt(sizer));
if (aim >= parseInt(smallest))
{document.body.style.fontSize = aim + "px";}
else
{document.body.style.fontSize = parseInt(smallest) + "px";}
}

-->
</script>
</head>
<body onload="scale();" onresize="scale();">
<div style="text-align: justify; width: 50%">
Some text here Some text here Some text here 
Some text here Some text here Some text here 
Some text here Some text here Some text here 
Some text here Some text here Some text here 
</div>
</body>
</html>
              Last edited by realityhack; 7 August 2009, 09:40.

              Comment

                #8
                Originally posted by realityhack View Post
                NF - any ideas?
                I bet he says "Email should be in plain text." and probably with a smiley!
                My all-time favourite Dilbert cartoon, this is: BTW, a Dumpster is a brand of skip, I think.

                Comment

                  #9
                  HTML email is the way forward. I hate getting text-only emails... it's 2009 for crying out loud, we're not working on some Compuserve BBS.

                  Anyway... it sounds like a bad idea. I like HTML emails, but if the email starts 'animating' as I resize my email window I'm going to be put off. Don't you want your sig to be sized appropriately compared to the font used in your email?
                  Originally posted by MaryPoppins
                  I'd still not breastfeed a nazi
                  Originally posted by vetran
                  Urine is quite nourishing

                  Comment

                    #10
                    Originally posted by suityou01 View Post
                    you've been a great help.
                    sorry, bitter experience. just trying to be helpful.

                    Comment

                    Reply to Thread
                    1 to 10 of 15 Previous 1 2 template Next

                    Advertisers

                    1. Contracting
                      1. General
                        1. Brexit
                      2. Business / Contracts
                        1. Coronavirus Assistance
                      3. Accounting / Legal
                        1. Umbrella Companies
                        2. HMRC Scheme Enquiries
                        3. The Future of Contracting
                        4. IR35 Reform
                      4. Technical
                      5. Welcome / FAQs
                    2. Social
                      1. Light Relief
                      2. Social / Events
                    Working...
                    X