Styling TinyMCE the interface - part 2

Read more about this in my blog post

This is a update to the original example to where I've intergrated my stylesheet work into the Visualchars plugin to allow the "structure" view to be toggled on and off.

The style sheet works best in modern non-IE browsers due to their better CSS support, IE8 works reasonably but misses out on some niceness.

Click the ś sign to enable the styles.

<h1>Level 1 Heading</h1>
			<h2>Level 2 Heading</h2>
			<h3>Level 3 Heading</h3>
			<h4>Level 4 Heading</h4>
			<h5>Level 5 Heading</h5>
			<h6>Level 6 Heading</h6>
			
			<p>
				Paragraph. Lorem ipsum dolor sit amet, <a href="http://www.example.com">consectetur adipiscing elit.</a> 
				Donec <abbr>ABBR HTML</abbr> sagittis fermentum ante, vel imperdiet quam faucibus eu. 
				Sed sodales <b>B erat eu est</b> euismod tempor.
				Vivamus odio nisi, sollicitudin non sodales rhoncus, vulputate vitae sapien. Cras sed felis eros. Etiam consectetur pellentesque lacinia. Donec sit amet accumsan est. Aliquam et tincidunt elit. Aenean eu ante felis, sit amet convallis leo. Nulla facilisi.
			</p>
			<p>
				Paragraph. Vivamus odio nisi, sollicitudin non sodales rhoncus, vulputate vitae sapien. Cras sed felis eros. Etiam consectetur pellentesque lacinia. Donec sit amet accumsan est. Aliquam et tincidunt elit. Aenean eu ante felis, sit amet convallis leo. Nulla facilisi.
			</p>
			
			<blockquote>				
				<p style="font-family:georgia; color:#FF0080;" class="test">
					Donec varius consequat ligula, quis sagittis tortor consectetur sed.
				</p> 
				
				<p>
					Vestibulum rutrum ultricies tincidunt. <br /><br />Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc pretium, est sit amet gravida consequat, nibh ante faucibus urna, <br />vitae venenatis diam purus in erat.
				</p>
			</blockquote>
			
			<p class="MsoNormal">
				Vestibulum rutrum ultricies tincidunt. <q>Q Cum sociis natoque penatibus et magnis dis parturient montes,</q> nascetur ridiculus mus. Nunc pretium, est sit amet gravida consequat.
			</p>
		
			
			
			<img src="http://a1.twimg.com/profile_images/526726036/profile_edited-1.jpg" alt="my profile avatar" />
			<img src="http://a1.twimg.com/profile_images/526726036/profile_edited-1.jpg" alt="my profile avatar" />
			
			<table>
				<tr>
					<th>Table heading</th>
					<th>Table heading</th>
					<th>Table heading</th>
				</tr>
				<tr>
					<td>1</td>
					<td>2</td>
					<td>3</td>					
				</tr>
				<tr>
					<td>A</td>
					<td>B</td>
					<td>C</td>					
				</tr>
				
				
			</table>
			
			<ol>
			  <li>Coffee</li>
			  <li>Tea</li>
			  <li>Milk</li>
			</ol>
			
			<ul>
			  <li>Coffee</li>
			  <li>Tea</li>
			  <li>Milk</li>
			</ul>