# Best tag for text size freedom in HTML???

**URL:** https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332
**Category:** Factual Questions
**Created:** [August 26, 2008, 5:57pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332 "2008-08-26T17:57:21Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 26, 2008, 5:57pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/1 "2008-08-26T17:57:21Z")

</div>

Google isn’t doing me any favours here.

in the font tag you are (I think) limited to 1-7 and 7 isn’t very big at all.

When I learned ASP I wrote a while loop which increased the text size by 1 each time, and worked. I’m trying to do the same with PHP and it’s at best: Feeble

(while loop stops when the size gets to 500 but the actual text doesn’t get any bigger after 7!)

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 26, 2008, 6:03pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/2 "2008-08-26T18:03:25Z")

</div>

Doesn’t matter. I got it… 🙂

$textsize = 5;  
while($textsize \< 500)  
{  
echo “\<p\>\<font style=font-size:$textsize\>$a\_variable\</font\>\</p\>”;  
++ $textsize;  
}

---

<div class="post-metadata">

### Author: ![friedo](https://avatars.discourse-cdn.com/v4/letter/f/8edcca/32.png) [@friedo](https://boards.straightdope.com/u/friedo)
#### Post date: [August 26, 2008, 6:18pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/3 "2008-08-26T18:18:06Z")

</div>

You’re using CSS to set the font style in a \<font\> tag. That’s a tad nutty.

If you want to define inline arbitrary styles, use a \<span\>.

---

<div class="post-metadata">

### Author: ![tetranz](https://avatars.discourse-cdn.com/v4/letter/t/a587f6/32.png) [@tetranz](https://boards.straightdope.com/u/tetranz)
#### Post date: [August 26, 2008, 6:19pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/4 "2008-08-26T18:19:44Z")

</div>

I’m pleased it works for you. I don’t mean to sound too critical but the use of font tags puts you back in the 20th century.

Seriously, if this is something for public viewing, you should take a look at using style sheets. It’s a much more flexible way to go, your pages will be “lighter” (ie less bandwidth and probably load faster) and you’ll show the world that you’re no longer working in 1999.

---

<div class="post-metadata">

### Author: ![tetranz](https://avatars.discourse-cdn.com/v4/letter/t/a587f6/32.png) [@tetranz](https://boards.straightdope.com/u/tetranz)
#### Post date: [August 26, 2008, 6:21pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/5 "2008-08-26T18:21:18Z")

</div>

friedo’s right. I didn’t notice that you’re using a weird combination of both.

---

<div class="post-metadata">

### Author: ![ZipperJJ](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/zipperjj/32/211_2.png) [@ZipperJJ](https://boards.straightdope.com/u/ZipperJJ)
#### Post date: [August 26, 2008, 6:25pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/6 "2008-08-26T18:25:09Z")

</div>

You could use \<p style=“font-size: [variablenumber]pt;”\>Text\</p\>

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 26, 2008, 7:10pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/7 "2008-08-26T19:10:52Z")

</div>

It’s not for public viewing… It’s for messing about and learning PHP, so getting the HTML/CSS right is secondary. (I lazilly chose the first thing that came into my head to give me control over the font: ‘font’) I know I should get into good habits so thanks for the comments 🙂 (no sarcasm meant)

Wouldn’t doing it ‘properly’ with CSS make it impossible to randomize the values every time?

“Randomize the values?” You ask? Ah yes… things have changed since the OP (mwah ha ha!)…  
\<?php

```
$chars = array(0,1,2,3,4,5,6,7,8,9,'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','r','s','t','u','w','x','y','z','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','R','S','T','U','W','X','Y','Z','?','!','#','@','%');
$count=0;
echo "&lt;p&gt;";
while($count &lt; 15000) 
{
	//srand(time());
	$textcolor = dechex(rand(0,16700000));
	$textsize = (rand(1,150));
	$char = $chars[rand(0,67)];
	
	echo "&lt;font style=font-size:$textsize;color:$textcolor&gt;$char&lt;/font&gt; 

```

";  
++ $count;  
}  
echo “\</p\>”;

?\>

---

<div class="post-metadata">

### Author: ![Mangetout](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/mangetout/32/19_2.png) [@Mangetout](https://boards.straightdope.com/u/Mangetout)
#### Post date: [August 26, 2008, 8:56pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/8 "2008-08-26T20:56:13Z")

</div>

You can specify font size in pixels in CSS (or inline styles), I think. Something like:

\<p style=“font-size:20px”\>Hello World\</p\>

---

<div class="post-metadata">

### Author: ![Stealth\_Potato](https://avatars.discourse-cdn.com/v4/letter/s/d78d45/32.png) [@Stealth\_Potato](https://boards.straightdope.com/u/Stealth_Potato)
#### Post date: [August 26, 2008, 10:04pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/9 "2008-08-26T22:04:09Z")

</div>

[QUOTE=Lobsang]  
$textcolor = dechex(rand(0,16700000));  
[/QUOTE]

Any particular reason you’re leaving out 77,215 possible colors? 😉

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 26, 2008, 10:15pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/10 "2008-08-26T22:15:03Z")

</div>

[QUOTE=Stealth Potato]  
Any particular reason you’re leaving out 77,215 possible colors? 😉  
[/QUOTE]

Pure laziness. 😃

---

<div class="post-metadata">

### Author: ![Stealth\_Potato](https://avatars.discourse-cdn.com/v4/letter/s/d78d45/32.png) [@Stealth\_Potato](https://boards.straightdope.com/u/Stealth_Potato)
#### Post date: [August 26, 2008, 10:28pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/11 "2008-08-26T22:28:51Z")

</div>

Well, at least this particular instance of laziness will prevent your rendered text from being _completely_ invisible on a white background. Carry on!

---

<div class="post-metadata">

### Author: ![Duckster](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/duckster/32/1244_2.png) [@Duckster](https://boards.straightdope.com/u/Duckster)
#### Post date: [August 26, 2008, 10:34pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/12 "2008-08-26T22:34:40Z")

</div>

[QUOTE=Lobsang]  
Pure laziness. 😃  
[/QUOTE]

Color you bored. No go find the #XXXXXX for that!

😃

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 27, 2008, 12:05am UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/13 "2008-08-27T00:05:40Z")

</div>

[QUOTE=Duckster]  
Color you bored. No go find the #XXXXXX for that!

😃  
[/QUOTE]

Funnily enough, when my office colleagues sampled my creation the exact words of one of them was “So you’re as bored today as we are?”

edit: the latest incarnation now randomizes the font and the x/y position, but firefox doesn’t display the wingdings or webdings fonts without a config change so it doesn’t look much different.

Latest code…

\<?php

```
$chars = array(0,1,2,3,4,5,6,7,8,9,'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','r','s','t','u','w','x','y','z','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','R','S','T','U','W','X','Y','Z','?','!','#','@','%');
$fonts = array('abadi','French Script','Old English Text','Almanac','Garamond','Onyx','Andale Mono','Gautami','Palace Script','Andy Bold','Georgia','Parties','Arial','Gill Sans','Pepita','Arial Unicode','Gloucester Extra Condensed','Perpetua','Batang','Goudy Old Style','Placard Condensed','Bell','Gulim','Raavi','Bernard Condensed','Hei','Rockwell','Bodoni','Heisei','Runic Condensed','Bon Apetit','Holidays','Script Bold','Bookman Old Style','Impact','Shruti','Braggadocio','Imprint Shadow','Signs','Brush Script Italic','Kartika','SimHei','Calisto','Keystrokes','SimSun','Castellar','Kino','Sorts ','Sorts 2','Centaur','Latha','Sports 2','Sports 3','Century Gothic','Lucida','Symbol','Century Schoolbook','Mangal','Tahoma','Colonna','Matura Script Capitals','Times New Roman','Comic Sans','Mercurius Script Bold','Transport','Corsiva','Microsoft','Sans Serif','Trebuchet','Courier New','MingLiU','Tunga','Curlz','MS Gothic','Twentieth Century','Directions','MS Mincho','Vacation','Engravers','MV Boli','Verdana','Felix Titling','News Gothic','Vrinda','Footlight','Nina','Webdings','Forte','OCR A Extended','Wingdings');

$count=0;
echo "&lt;p&gt;";
while($count &lt; 5000) 
{
	$textcolor = dechex(rand(0,16700000));
	$textsize = (rand(1,150));
	$char = $chars[rand(0,count($chars))];
	$fontface = $fonts[rand(0,count($fonts))];
	$top=(rand(0,1024));
	$left=(rand(0,1280));
	
	echo "&lt;font style=position:absolute;top:$top;left:$left;font-family:'$fontface';font-size:$textsize;color:$textcolor&gt;$char&lt;/font&gt; 

```

";  
++ $count;  
}  
/\*  
while($count \<= count($fonts))  
{  
$fontface = $fonts[$count];  
echo "\<font style=font-family:‘$fontface’;font-size:30;\>$fontface\</font\>&nbsp;  
";  
++$count;  
}\*/  
echo “\</p\>”;

?\>

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 27, 2008, 12:15am UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/14 "2008-08-27T00:15:11Z")

</div>

For those who are not able to replicate my PHP code this what it does…

[![](https://img.photobucket.com/albums/v98/lobley/sausage.jpg) ](https://img.photobucket.com/albums/v98/lobley/sausage.jpg)

---

<div class="post-metadata">

### Author: ![drewbert](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/drewbert/32/15890_2.png) [@drewbert](https://boards.straightdope.com/u/drewbert)
#### Post date: [August 27, 2008, 1:45am UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/15 "2008-08-27T01:45:31Z")

</div>

That’s great, but can you do [this](http://nedbatchelder.com/blog/200805/css_homer_animated.html)?

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 27, 2008, 3:26pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/16 "2008-08-27T15:26:38Z")

</div>

[QUOTE=drewbert]  
That’s great, but can you do [this](http://nedbatchelder.com/blog/200805/css_homer_animated.html)?  
[/QUOTE]

Ummmm… Not yet.  
It’s funny how homer has a tit for a face for a while 😃

edit: You can select him too…

o  
o  
o  
o  
(  
O  
O  
O  
  
L  
(  
O  
O  
O  
O  
O  
  
L  
(  
O  
|  
|  
  
  
|  
|  
  
  
  
  
(  
(  
8  
o  
o  
o  
(  
(  
8  
o  
o  
o  
o  
)  
)  
b  
o  
O  
o  
o  
o  
o  
o  
o  
)  
b  
o  
O  
o  
o  
o  
o  
o  
o  
o  
o  
o  
/  
/  
/  
•  
•  
•  
•  
•  
\_  
\_  
\_  
•  
•  
•  
C  
C  
O  
(

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 27, 2008, 11:55pm UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/17 "2008-08-27T23:55:47Z")

</div>

[QUOTE=Stealth Potato]  
Any particular reason you’re leaving out 77,215 possible colors? 😉  
[/QUOTE]

I just discovered that including those colours changes things significantly. What I now get is a display of mostly the ‘warm’ colours (yellow, red, orange and the occasional green)…

[![](https://img.photobucket.com/albums/v98/lobley/all-colours.jpg) ](https://img.photobucket.com/albums/v98/lobley/all-colours.jpg)

Why does including a mere less than half a percent of extra colours yield such a significantly different result?

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 28, 2008, 12:04am UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/18 "2008-08-28T00:04:00Z")

</div>

p.s. 256_256_256 = 16,777,216. And I am assuming you know what you are doing, so why does your number = one less than mine?

And… If I add another three levels of precision to my original 16,700,000 (16,777,200)I get the mostly cold colours!

---

<div class="post-metadata">

### Author: ![Lobsang](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/lobsang/32/4067_2.png) [@Lobsang](https://boards.straightdope.com/u/Lobsang)
#### Post date: [August 28, 2008, 12:07am UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/19 "2008-08-28T00:07:32Z")

</div>

Between 16,777,214 and 16,777,215 the colours switch from warm to cold. That’s weird.

edit: and because 16,700,000 seems to show a full range (emphasis on ‘seems’) then it appears to have been a very lucky accident. It achieves my goal of being truly random colour wise.

---

<div class="post-metadata">

### Author: ![KRSOradio](https://avatars.discourse-cdn.com/v4/letter/k/0ea827/32.png) [@KRSOradio](https://boards.straightdope.com/u/KRSOradio)
#### Post date: [August 28, 2008, 1:29am UTC](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332/20 "2008-08-28T01:29:39Z")

</div>

you could set the font in CSS in pixles say 10pt then use a pecent increase.

body{font-size: 10pt}  
h1{font-size: 105%}

[Next page](https://boards.straightdope.com/t/best-tag-for-text-size-freedom-in-html/461332.md?page=2)