File:  [LON-CAPA] / modules / damieng / wkhtmltopdf_test / test.html
Revision 1.1: download - view: text, annotated - select for diffs
Thu Jan 26 17:46:45 2017 UTC (7 years, 2 months ago) by damieng
Branches: MAIN
CVS tags: HEAD
added wkhtmltopdf_test to print to PDF from HTML documents

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>MathJax test for wkhtmltopdf</title>
<script src="print_column_layout.js"></script>
<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    tex2jax: { inlineMath: [['$','$'],['\\(','\\)']] }
  });
  MathJax.Hub.Register.StartupHook("End", function () {
    console.log("Typeset by MathJax done.");
    LCPRINT.layout(2);
  });
</script>
<script type="text/javascript" src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG"></script>
<style>
  /* see https://github.com/wkhtmltopdf/wkhtmltopdf/issues/1872 */
  /* and https://code.google.com/p/chromium/issues/detail?id=99358 */
  /*
body {
  column-count: 2;
  -webkit-column-count: 2;
  -moz-column-count: 2;
}
  */
  body {
    margin: 0;
    padding: 0;
    border: none;
    font-size: 80%;
  }
  .page-table {
    margin: 0;
    padding: 0;
    width: 100%;
    page-break-after: always;
    background-color: #F0F0FF;
    border: 1px solid #A0A0FF;
  }
  .page-table tr {
    margin: 0;
    padding: 0;
  }
  .page-table td {
    margin: 0;
    padding: 1em;
    vertical-align: top;
    overflow: hidden;
    background-color: #FFF0F0;
    border: 1px solid #FFA0A0;
  }
  .block {
    border: 1px solid #A0FFA0;
    background-color: #F0FFF0;
    page-break-inside: avoid;
  }
  img.resize {
    width: 100%;
    max-width: 400px;
  }
</style>
</head>

<body>

<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>								
</div>

<div class="block">
<p>test to make sure images are not cut at page break:</p>
</div>

<div class="block"><img src="image.jpg" class="resize"></div>
<div class="block"><img src="image.jpg" class="resize"></div>
<div class="block"><img src="image.jpg" class="resize"></div>
<div class="block"><img src="image.jpg" class="resize"></div>
<div class="block"><img src="image.jpg" class="resize"></div>

<p>page break after this hr</p>
<hr style="page-break-after: always;">

<div style="background-color: yellow; padding-left:1em">
This is a long div with a yellow background
<div class="block">
<p>more equations</p>
</div>

<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>                                                         
</div>
<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>                                                         
</div>

<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elementum, lacus nec fringilla bibendum, felis nunc mattis ipsum, nec bibendum eros lacus sit amet lectus. Suspendisse vel lacus tortor. Praesent finibus sed tortor et maximus. Etiam et ante vitae ex imperdiet malesuada. Aliquam erat volutpat. Aliquam imperdiet feugiat nulla et pharetra. Sed ultrices cursus diam, vel pharetra ex semper quis. Vestibulum sed sagittis nisi. Phasellus quis nunc quis risus ultrices commodo. Quisque cursus magna vel magna semper, eu commodo nulla rhoncus. Aliquam imperdiet sit amet ex quis lacinia. Suspendisse at tellus pharetra, iaculis nisl ac, consectetur ipsum.
</p>
<p>
Integer sodales accumsan metus sed bibendum. Donec fringilla dolor nulla, non imperdiet metus eleifend a. Pellentesque nulla tellus, finibus vitae sem eu, vestibulum sollicitudin nulla. Praesent leo ipsum, accumsan venenatis dapibus nec, pulvinar a erat. Donec molestie, lectus ut varius semper, nisi dui faucibus turpis, ut aliquet felis mauris pharetra dolor. Sed egestas hendrerit velit. Sed cursus, lectus ut luctus euismod, erat urna porta ligula, laoreet tincidunt ligula neque sit amet est. Nunc lacinia bibendum diam non feugiat. Nulla ut nibh suscipit, cursus arcu nec, luctus ex. Morbi et ullamcorper nulla. Nullam ac semper lorem. Duis fringilla tortor a porta ultricies. Morbi aliquet sagittis augue, eget auctor neque imperdiet eget. Cras ac scelerisque nibh.
</p>
<p style="break-before: column">column break before this paragraph</p>
<p>
Nam eget commodo justo. Pellentesque in ornare leo. Proin lectus mauris, euismod a vulputate eu, iaculis at lectus. Curabitur vestibulum mauris sed mollis porta. Suspendisse turpis tortor, ultricies ac nisi quis, facilisis egestas ligula. Pellentesque est metus, varius facilisis ultricies nec, sodales at nulla. Integer mauris massa, ultrices sed finibus nec, convallis et est. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec sit amet consequat metus. Proin ultrices diam a sapien pharetra, tempus consectetur erat accumsan. Nam ultricies urna quis mollis molestie. Nulla quis imperdiet dolor. In ac fringilla nisl, viverra dignissim dui.
</p>
<p>
Nunc tincidunt blandit dolor eu porttitor. Aenean metus felis, posuere nec vestibulum pretium, finibus non diam. Ut porta diam eget interdum viverra. Ut posuere consectetur ex, vel varius leo egestas scelerisque. In eleifend congue enim, cursus ultricies tellus ornare quis. Donec cursus porta maximus. Donec quam lectus, pharetra vel interdum non, iaculis ac lorem. Cras porttitor arcu eu lacinia fringilla. Aliquam condimentum sem mi. Nullam laoreet, urna ac lobortis viverra, urna sapien malesuada tortor, at gravida nunc mauris sed dolor. Maecenas sagittis porta diam non tempor.
</p>
<p>
Donec malesuada nec dolor vitae bibendum. Fusce vitae nunc ultrices justo efficitur consectetur eu quis ipsum. Curabitur rhoncus diam mi, ac tempus elit consequat in. Praesent nec sodales sapien. Aliquam nisi sapien, fringilla id quam eu, consectetur porttitor leo. Cras eget molestie justo. Mauris pulvinar purus vitae fringilla egestas. Aliquam porttitor neque quis enim posuere, non pretium ex fermentum. Fusce imperdiet tortor quis arcu placerat vehicula. Vestibulum vel malesuada velit, sit amet rhoncus tellus. Curabitur vel ex justo.
</p>

<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elementum, lacus nec fringilla bibendum, felis nunc mattis ipsum, nec bibendum eros lacus sit amet lectus. Suspendisse vel lacus tortor. Praesent finibus sed tortor et maximus. Etiam et ante vitae ex imperdiet malesuada. Aliquam erat volutpat. Aliquam imperdiet feugiat nulla et pharetra. Sed ultrices cursus diam, vel pharetra ex semper quis. Vestibulum sed sagittis nisi. Phasellus quis nunc quis risus ultrices commodo. Quisque cursus magna vel magna semper, eu commodo nulla rhoncus. Aliquam imperdiet sit amet ex quis lacinia. Suspendisse at tellus pharetra, iaculis nisl ac, consectetur ipsum.
</p>
<p>
Integer sodales accumsan metus sed bibendum. Donec fringilla dolor nulla, non imperdiet metus eleifend a. Pellentesque nulla tellus, finibus vitae sem eu, vestibulum sollicitudin nulla. Praesent leo ipsum, accumsan venenatis dapibus nec, pulvinar a erat. Donec molestie, lectus ut varius semper, nisi dui faucibus turpis, ut aliquet felis mauris pharetra dolor. Sed egestas hendrerit velit. Sed cursus, lectus ut luctus euismod, erat urna porta ligula, laoreet tincidunt ligula neque sit amet est. Nunc lacinia bibendum diam non feugiat. Nulla ut nibh suscipit, cursus arcu nec, luctus ex. Morbi et ullamcorper nulla. Nullam ac semper lorem. Duis fringilla tortor a porta ultricies. Morbi aliquet sagittis augue, eget auctor neque imperdiet eget. Cras ac scelerisque nibh.
</p>
<p>
Nam eget commodo justo. Pellentesque in ornare leo. Proin lectus mauris, euismod a vulputate eu, iaculis at lectus. Curabitur vestibulum mauris sed mollis porta. Suspendisse turpis tortor, ultricies ac nisi quis, facilisis egestas ligula. Pellentesque est metus, varius facilisis ultricies nec, sodales at nulla. Integer mauris massa, ultrices sed finibus nec, convallis et est. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec sit amet consequat metus. Proin ultrices diam a sapien pharetra, tempus consectetur erat accumsan. Nam ultricies urna quis mollis molestie. Nulla quis imperdiet dolor. In ac fringilla nisl, viverra dignissim dui.
</p>
<p>
Nunc tincidunt blandit dolor eu porttitor. Aenean metus felis, posuere nec vestibulum pretium, finibus non diam. Ut porta diam eget interdum viverra. Ut posuere consectetur ex, vel varius leo egestas scelerisque. In eleifend congue enim, cursus ultricies tellus ornare quis. Donec cursus porta maximus. Donec quam lectus, pharetra vel interdum non, iaculis ac lorem. Cras porttitor arcu eu lacinia fringilla. Aliquam condimentum sem mi. Nullam laoreet, urna ac lobortis viverra, urna sapien malesuada tortor, at gravida nunc mauris sed dolor. Maecenas sagittis porta diam non tempor.
</p>
<p>
Donec malesuada nec dolor vitae bibendum. Fusce vitae nunc ultrices justo efficitur consectetur eu quis ipsum. Curabitur rhoncus diam mi, ac tempus elit consequat in. Praesent nec sodales sapien. Aliquam nisi sapien, fringilla id quam eu, consectetur porttitor leo. Cras eget molestie justo. Mauris pulvinar purus vitae fringilla egestas. Aliquam porttitor neque quis enim posuere, non pretium ex fermentum. Fusce imperdiet tortor quis arcu placerat vehicula. Vestibulum vel malesuada velit, sit amet rhoncus tellus. Curabitur vel ex justo.
</p>
</div>

<div class="block">
<p>more equations</p>
</div>

<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>                                                         
</div>
<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>                                                         
</div>

<div class="block">
<p>more equations</p>
</div>

<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>                                                         
</div>
<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>                                                         
</div>

<div class="block">
<p>more equations</p>
</div>

<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>                                                         
</div>
<div class="block">
<h1>The Lorenz Equations</h1>

\[\begin{aligned}
\dot{x} &amp; = \sigma(y-x) \\
\dot{y} &amp; = \rho x - y - xz \\
\dot{z} &amp; = -\beta z + xy
\end{aligned} \]
</div>

<div class="block">
<h1>The Cauchy-Schwarz Inequality</h1>

\[ \left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \]
</div>

<div class="block">
<h1>A Cross Product Formula</h1>

\[\mathbf{V}_1 \times \mathbf{V}_2 =  \begin{vmatrix}
\mathbf{i} &amp; \mathbf{j} &amp; \mathbf{k} \\
\frac{\partial X}{\partial u} &amp;  \frac{\partial Y}{\partial u} &amp; 0 \\
\frac{\partial X}{\partial v} &amp;  \frac{\partial Y}{\partial v} &amp; 0
\end{vmatrix}  \]
</div>

<div class="block">
<h1>The probability of getting \(k\) heads when flipping \(n\) coins is</h1>

\[P(E)   = {n \choose k} p^k (1-p)^{ n-k} \]
</div>

<div class="block">
<h1>An Identity of Ramanujan</h1>

\[ \frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+\ldots} } } } \]
</div>

<div class="block">
<h1>A Rogers-Ramanujan Identity</h1>

\[  1 +  \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots =
\prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})},
\quad\quad \text{for $|q|&lt;1$}. \]
</div>

<div class="block">
<h1>Maxwell&#8217;s Equations</h1>

\[  \begin{aligned}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &amp; = \frac{4\pi}{c}\vec{\mathbf{j}} \\   \nabla \cdot \vec{\mathbf{E}} &amp; = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} &amp; = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} &amp; = 0 \end{aligned}
\]
</div>

<div class="block">
<p>Finally, while display equations look good for a page of samples, the ability to mix math and text in a paragraph is also important. This expression \(\sqrt{3&#215;-1}+(1+x)^2\) is an example of an inline equation.  As you see, MathJax equations can be used this way as well, without unduly disturbing the spacing between lines.</p>                                                         
</div>

</body>
</html>

FreeBSD-CVSweb <freebsd-cvsweb@FreeBSD.org>