Search code examples
htmlcssdeprecated

Converting old Html SIZE=+x to css


I'm remaking an old website with html and CSS, having never made a website with "old-style" mark-up I have no idea what the size=+x relates to in CSS, is it pixels or what? Is there a way of replicating this in css or do i have to specify the size exactly?

In short, how do i add x pixels to something i dont know the size of?

For my particular example here is the mark-up:

<H1 ALIGN=CENTER>
    <B><FONT color="red" SIZE=+4>PHONE BOOK</FONT></B>
</H1></CENTER>

Solution

  • This dirty old value is equivalent to this css

    .item{
      font-size: xxx-large;
    }
    

    That's if you view it in webkit. In firefox, it's about 48px.

    Here's the old plus and minus tags in action

    Here's the W3C's details of the modern equivalents

    The old font sizes are set relative to the browsers current default font-size. It's not the sort of thing you want to leave up to chance, if you want your site to look how it was designed.

    Want my opinion, dump it, and use a value of em or px instead.

    For the good of your sanity, don't sweat too much over matching these crummy old values, do it by sight, or if you're really worried, do pixel comparisons of screen-grabs.