@swnat/ckeditor-custom-build/docs/_snippets/examples/balloon-block-editor.html

The development environment of CKEditor 5 – the best browser-based rich text editor.

<div id="snippet-balloon-block-editor">
	<h2>Taj Mahal: A breathtaking ode to love</h2>

	<figure class="image image-style-side" height="400">
		<img src="%BASE_PATH%/assets/img/tajmahal.jpg" alt="Taj Mahal illustration.">
		<figcaption>Taj Mahal with its poetic white marble tomb</figcaption>
	</figure>

	<p>No trip to India is complete without visiting this spectacular monument, <a href="https://en.wikipedia.org/wiki/New7Wonders_of_the_World"><strong>counted among the Seven Wonders of the World</strong></a>.
	</p>

	<p>Tourists frequently admit that Taj Mahal "simply cannot be described with words". And that’s probably true. The more you try the more speechless you become. Words give only a semblance of truth. The real truth about its beauty is revealed when you adore <strong>different shades of “Taj” depending on the time of the day</strong> or when you admire the exquisite inlay work in different corners of the façade.</p>

	<h3>Masterpiece of the world’s heritage</h3>

	<p>Taj Mahal is a mausoleum built in Agra between 1631 and 1648 by Emperor Shah Jahan <strong>in the memory of his beloved wife</strong>, Mumtaz Mahal, whose body lies there. It took 20 000 workers to complete and the excellence of this building is visible in every brick.</p>

	<p>In 1983, Taj Mahal was appointed <a href="https://en.wikipedia.org/wiki/World_Heritage_Site">UNESCO World Heritage Site</a> for being "the jewel of Muslim art in India and one of the universally admired masterpieces of the world's heritage".</p>

	<p>If you like having a methodology for visiting historical places, here are the four elements on which we recommend to focus your attention:</p>

	<ul>
		<li>The tomb</li>
		<li>The Decorations</li>
		<li>The Garden</li>
		<li>The Outlying buildings</li>
	</ul>

	<p>The tomb is what immediately catches your eyesight. The <strong>white and soft marble</strong> embroidered with stones leaves you totally enchanted.</p>
</div>

<style>
	/* Restrict the width of the editor to isolate it from the content of the guide. */
	#snippet-balloon-block-editor {
		margin-left: 5%;
		margin-right: 5%;
	}
</style>