Math
Back to Home
Description
Provides enhanced styling for mathematical content with MathJax integration, custom fonts, and figure containers. Supports both MathJax-rendered math and custom-styled mathematical expressions.
Usage
Wrap mathematical content in <figure class="math"> containers. Use <math> tags for MathJax rendering or <p> elements for custom-styled math.
Available Options
CSS Classes:
figure.math - Container for mathematical content with calculator icon
.left - Left-aligns mathematical content
.fake-mathjax-numbers - Custom font for numbers and symbols
Automatic Features:
MathJax integration for <math> tags
Custom MathJax fonts (Fake-MathJax, Fake-MathJax-Numbers)
Calculator icon in captions (FontAwesome)
Centered alignment by default
Overflow handling for long expressions
Examples
Basic Math Figure
E = mc²
Einstein's mass-energy equivalence formula
MathJax Integration
a
+
b
=
c
Simple algebraic equation using MathML
Complex Mathematical Expression
The quadratic formula: x = (-b ± √(b² - 4ac)) / 2a
Standard quadratic formula for solving ax² + bx + c = 0
Left-Aligned Math
∫₀^∞ e^(-x²) dx = √π/2
Gaussian integral - left-aligned for inline text
Math with Custom Number Styling
The derivative of f(x) = 3x² + 2x + 1 is f'(x) = 6x + 2
Polynomial differentiation with custom number styling
Mathematical Proof
Proof: If a = b and b = c, then a = c (Transitive Property)
Transitive Property of Equality
This fundamental property states that if two quantities are equal to the same third quantity, then they are equal to each other.
Mathematical Notation
Set notation: A = {x ∈ ℝ | x > 0}
Set of all positive real numbers
Notes
MathJax automatically loads when <math> tags are present
Use figure.math for proper styling and calculator icon
.left class aligns math to the left instead of center
.fake-mathjax-numbers provides custom font styling for numbers
Math figures support overflow scrolling for long expressions
Captions can contain any HTML content including headings and lists
MathJax supports LaTeX, MathML, and AsciiMath notation
Consider accessibility when using mathematical notation
Use descriptive captions to explain mathematical concepts