Pure HTML Math - Revision history

Rational Point: /* HTML-only equations directly in the wiki code! */ code listings

2025-01-21T23:14:13Z

HTML-only equations directly in the wiki code!: code listings

@@ Line 65: / Line 65: @@
 <i>a</i></div>
 </div></div>
 <hr>
 <div style="text-align:center">
@@ Line 72: / Line 82: @@
 <small><i>n</i> = 1</small>
 </div> <div style="display:inline-block;vertical-align:middle;text-align:center">1<hr style="border-top:1pt solid;border-bottom:0;margin:0;padding:0"><i>n</i><sup><i>s</i></sup></div></div>
 <hr>
 <div style="text-align:center">
@@ Line 80: / Line 98: @@
 </div> <i>e</i><sup>–<i>x</i><sup>2</sup></sup> <i>dx</i> = <big>√</big><div style="display:inline-block;border-top:1pt solid">
 <i>π</i></div></div>
 <hr>
 Are all <tt>&lt;div&gt;</tt> elements cleared?

Rational Point: /* HTML-only equations directly in the wiki code! */ adjust simplify

2025-01-21T22:50:47Z

HTML-only equations directly in the wiki code!: adjust simplify

← Older revision		Revision as of 22:50, 21 January 2025
Line 67:		Line 67:
	<hr>		<hr>
	<div style="text-align:center">		<div style="text-align:center">
	<i>ζ</i>(<i>s</i>) = <div style="display:inline-block;vertical-align:middle;text-align:center;line-height:~~1.5ex~~">		<i>ζ</i>(<i>s</i>) = <div style="display:inline-block;vertical-align:middle;text-align:center;line-height:2ex">
	<~~font size="2"~~ style="line-height:4ex">∞</~~font~~><br>		<small style="line-height:4ex">∞</small><br>
	<font size="6" style="line-height:1ex">Σ</font><br>		<font size="6" style="line-height:1ex">Σ</font><br>
	<~~font size="1"~~><i>n</i> = 1</~~font~~>		<small><i>n</i> = 1</small>
	</div> <div style="display:inline-block;vertical-align:middle;text-align:center">1<hr style="border-top:1pt solid;border-bottom:0;margin:0;padding:0"><i>n</i><sup><i>s</i></sup></div></div>		</div> <div style="display:inline-block;vertical-align:middle;text-align:center">1<hr style="border-top:1pt solid;border-bottom:0;margin:0;padding:0"><i>n</i><sup><i>s</i></sup></div></div>
	<hr>		<hr>
	<div style="text-align:center">		<div style="text-align:center">
	<div style="display:inline-block;vertical-align:middle;text-align:center;line-height:2ex">		<div style="display:inline-block;vertical-align:middle;text-align:center;line-height:2ex">
	<~~font size="2"~~ style="line-height:4ex">∞</~~font~~><br>		<small style="line-height:4ex">∞</small><br>
	<font size="6" style="line-height:1ex">∫</font><br>		<font size="6" style="line-height:1ex">∫</font><br>
	<~~font size="2"~~>–∞</~~font~~>		<small>–∞</small>
	</div> <i>e</i><sup>–<i>x</i><sup>2</sup></sup> <i>dx</i> = <big>√</big><div style="display:inline-block;border-top:1pt solid">		</div> <i>e</i><sup>–<i>x</i><sup>2</sup></sup> <i>dx</i> = <big>√</big><div style="display:inline-block;border-top:1pt solid">
	<i>π</i></div></div>		<i>π</i></div></div>
	<hr>		<hr>
	Are all <tt><div></tt> elements cleared?		Are all <tt><div></tt> elements cleared?

Rational Point: /* HTML-only equations directly in the wiki code! */ adj

2025-01-18T18:47:04Z

HTML-only equations directly in the wiki code!: adj

← Older revision		Revision as of 18:47, 18 January 2025
Line 68:		Line 68:
	<div style="text-align:center">		<div style="text-align:center">
	<i>ζ</i>(<i>s</i>) = <div style="display:inline-block;vertical-align:middle;text-align:center;line-height:1.5ex">		<i>ζ</i>(<i>s</i>) = <div style="display:inline-block;vertical-align:middle;text-align:center;line-height:1.5ex">
	<font size="1" style="line-height:4ex">∞</font><br>		<font size="2" style="line-height:4ex">∞</font><br>
	<font size="6" style="line-height:1ex">Σ</font><br>		<font size="6" style="line-height:1ex">Σ</font><br>
	<font size="1"><i>n</i> = 1</font>		<font size="1"><i>n</i> = 1</font>
Line 74:		Line 74:
	<hr>		<hr>
	<div style="text-align:center">		<div style="text-align:center">
	<div style="display:inline-block;vertical-align:middle;text-align:center;line-height:~~1.5ex~~">		<div style="display:inline-block;vertical-align:middle;text-align:center;line-height:2ex">
	<font size="1" style="line-height:4ex">∞</font><br>		<font size="2" style="line-height:4ex">∞</font><br>
	<font size="6" style="line-height:1ex">∫</font><br>		<font size="6" style="line-height:1ex">∫</font><br>
	<font size="1">–∞</font>		<font size="2">–∞</font>
	</div> <i>e</i><sup>–<i>x</i><sup>2</sup></sup> <i>dx</i> = <big>√</big><div style="display:inline-block;border-top:1pt solid">		</div> <i>e</i><sup>–<i>x</i><sup>2</sup></sup> <i>dx</i> = <big>√</big><div style="display:inline-block;border-top:1pt solid">
	<i>π</i></div></div>		<i>π</i></div></div>
	<hr>		<hr>
	Are all <tt><div></tt> elements cleared?		Are all <tt><div></tt> elements cleared?

Rational Point: /* HTML-only equations directly in the wiki code! */ integral

2025-01-18T18:42:51Z

HTML-only equations directly in the wiki code!: integral

@@ Line 71: / Line 71: @@
 <font size="6" style="line-height:1ex">Σ</font><br>
 <font size="1"><i>n</i> = 1</font>
-</div> <div style="display:inline-block;vertical-align:middle;text-align:center">1<hr style="border-top:1pt solid;border-bottom:0;margin:0;padding:0"><i>n</i><sup><i>s</i></sup>
+</div> <div style="display:inline-block;vertical-align:middle;text-align:center">1<hr style="border-top:1pt solid;border-bottom:0;margin:0;padding:0"><i>n</i><sup><i>s</i></sup></div></div>

Rational Point: adjustment

2025-01-18T15:27:09Z

adjustment

← Older revision		Revision as of 15:27, 18 January 2025
Line 7:		Line 7:
	[[Image:Matheq.png]]		[[Image:Matheq.png]]

	This is Google Chrome displaying the following code.		This is Google Chrome displaying the following code. You will notice that the small infinity symbol <big>∞</big> above the capital sigma <big>Σ</big> is spaced a little bit too closely, but that is easily adjusted in line 29 of the code listing, by specifying <tt>style="line-height:4ex"</tt> instead of <tt>3.5ex</tt> to place it a little higher up.

	<syntaxhighlight lang=html>		<syntaxhighlight lang="html" line="1">
	<!DOCTYPE html>		<!DOCTYPE html>
	<html><head><meta charset="utf-8" />		<html><head><meta charset="utf-8" />
Line 46:		Line 46:
	</body></html>		</body></html>
	</syntaxhighlight>		</syntaxhighlight>


	Same in Firefox		Same in Firefox

Rational Point: Just say no to drugs!

2025-01-18T14:03:12Z

Just say no to drugs!

← Older revision		Revision as of 14:03, 18 January 2025
Line 1:		Line 1:
			== Look! No Mathjax! No Mathoid! No RESTBase! ==
			=== No 3<sup>rd</sup>-party equation-running SaaS APIs! ===
			==== Just say no to malware! Just say no to spyware! ====

	I have very clear readable math equations built from very simple HTML, CSS, and UTF-8 math characters. First draft scratchpad code. My thesis is that nothing fancier or more complicated is required to display math equations on the web. I use <tt>vertical-align:middle;</tt> and nothing more precise or delicate is required.		I have very clear readable math equations built from very simple HTML, CSS, and UTF-8 math characters. First draft scratchpad code. My thesis is that nothing fancier or more complicated is required to display math equations on the web. I use <tt>vertical-align:middle;</tt> and nothing more precise or delicate is required.

Line 46:		Line 50:
	[[Image:Matheq-ff.png]]		[[Image:Matheq-ff.png]]

	== ~~Directly~~ in the wiki code ==		== HTML-only equations directly in the wiki code! ==

	The HTML elements are styled directly here without the ability to insert CSS code in the head element of the web page. Whatever fonts are chosen for the web page are used for the math equations as well as the running text.		The HTML elements are styled directly here without the ability to insert CSS code in the head element of the web page. Whatever fonts are chosen for the web page are used for the math equations as well as the running text.

Rational Point: /* Directly in the wiki code (view source for comparison) */

2025-01-18T13:46:25Z

Directly in the wiki code (view source for comparison)

← Older revision		Revision as of 13:46, 18 January 2025
Line 46:		Line 46:
	[[Image:Matheq-ff.png]]		[[Image:Matheq-ff.png]]

	== Directly in the wiki code ~~<br> (view source for comparison)~~ ==		== Directly in the wiki code ==

			The HTML elements are styled directly here without the ability to insert CSS code in the head element of the web page. Whatever fonts are chosen for the web page are used for the math equations as well as the running text.

			There might be more efficient ways to do this.
			<hr>
	<div style="text-align:center"><i>x</i>		<div style="text-align:center"><i>x</i>
	= <div style="display:inline-block;vertical-align:middle;		= <div style="display:inline-block;vertical-align:middle;

Rational Point: /* Directly in the wiki code (view source for comparison) */ border padding

2025-01-18T13:33:23Z

Directly in the wiki code (view source for comparison): border padding

← Older revision		Revision as of 13:33, 18 January 2025
Line 53:		Line 53:
	± <big>√</big><div style="display:inline-block;border-top:1pt solid">		± <big>√</big><div style="display:inline-block;border-top:1pt solid">
	<i>b</i><sup>2</sup> – 4<i>ac</i></div>		<i>b</i><sup>2</sup> – 4<i>ac</i></div>
	<hr style="border-top:1pt solid;border-bottom:0">		<hr style="border-top:1pt solid;border-bottom:0;margin:0;padding:0">
	2<i>a</i></div>		2<i>a</i></div>
	</div></div>		</div></div>
Line 62:		Line 62:
	<font size="6" style="line-height:1ex">Σ</font><br>		<font size="6" style="line-height:1ex">Σ</font><br>
	<font size="1"><i>n</i> = 1</font>		<font size="1"><i>n</i> = 1</font>
	</div> <div style="display:inline-block;vertical-align:middle;text-align:center">1<hr style="border-top:1pt solid;border-bottom:0"><i>n</i><sup><i>s</i></sup>		</div> <div style="display:inline-block;vertical-align:middle;text-align:center">1<hr style="border-top:1pt solid;border-bottom:0;margin:0;padding:0"><i>n</i><sup><i>s</i></sup>

Rational Point: Directly in the wiki code

2025-01-18T13:31:59Z

Directly in the wiki code

← Older revision		Revision as of 13:31, 18 January 2025
Line 45:		Line 45:
	Same in Firefox		Same in Firefox
	[[Image:Matheq-ff.png]]		[[Image:Matheq-ff.png]]

			== Directly in the wiki code <br> (view source for comparison) ==

			<div style="text-align:center"><i>x</i>
			= <div style="display:inline-block;vertical-align:middle;
			text-align:center">– <i>b</i>
			± <big>√</big><div style="display:inline-block;border-top:1pt solid">
			<i>b</i><sup>2</sup> – 4<i>ac</i></div>
			<hr style="border-top:1pt solid;border-bottom:0">
			2<i>a</i></div>
			</div></div>
			<hr>
			<div style="text-align:center">
			<i>ζ</i>(<i>s</i>) = <div style="display:inline-block;vertical-align:middle;text-align:center;line-height:1.5ex">
			<font size="1" style="line-height:4ex">∞</font><br>
			<font size="6" style="line-height:1ex">Σ</font><br>
			<font size="1"><i>n</i> = 1</font>
			</div> <div style="display:inline-block;vertical-align:middle;text-align:center">1<hr style="border-top:1pt solid;border-bottom:0"><i>n</i><sup><i>s</i></sup>

Rational Point: br element has no applicable css settings

2025-01-18T13:05:51Z

br element has no applicable css settings

← Older revision		Revision as of 13:05, 18 January 2025
Line 13:		Line 13:
	vertical-align:middle;		vertical-align:middle;
	text-align:center;}		text-align:center;}
	~~.math br {margin:0;border:0;padding:0}~~
	.math div.sqrt {		.math div.sqrt {
	border-top:1px solid;}		border-top:1px solid;}