Converting old Html SIZE=+x to css

Question

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>

Answer 1

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.

Answer 2

in short the tag has 7 sizes for text: 1-7. the default was always 3 when used size=+1 it means make it a size larger than 3 (same as size=4).

it was used so different web browsers will show the page correctlly (their sizes are apparentlly different size 3 on explorer wasnt the same on firefox etc)

in css just define a font and a decent letter size and be done with it.

for further reading: http://www.jonstorm.com/html/font.htm