Tabbed Code Blocks
-
Take a look at the Code Project Article FAQ[^] If you have the same code snippet shown in multiple languages (eg C# and VB versions of the same code) you can wrap muiltiple PRE blocks inside a <div class="code-samples"> and have the multiple code blocks appear in a tabbed form, similar to MSDN eg
<div class="code-samples">
<pre lang="C#">
...
</pre>
<pre lang="VB.NET">
...
</pre>
</div>Just make sure you set the lang attribute correctly
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
Awesome! :thumbsup: Next time, I will try to RTFM :doh:
Be The Noise
-
Awesome! :thumbsup: Next time, I will try to RTFM :doh:
Be The Noise
There's a lot of stuff and a lot of options. It's easy to miss.
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
-
There's a lot of stuff and a lot of options. It's easy to miss.
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
-
I am in the very early stages of trying to come up with an article. For this article, I was thinking about providing the solution in C# and VB.NET, but I don't think the current code blocks can handle it without having 2 separate blocks for each section of code I will explain. I was thinking that it would be nice if we could have Tabbed code blocks (like MSDN)? This could facilitate multiple code language articles, but I could also see some other use cases: If you were explaining a main section of code, have the code in the first tab, then any ancillary classes can be included in tabs behind it.
Be The Noise
Example here. Thanks again, Chris & Co, for implementing this.
-
Example here. Thanks again, Chris & Co, for implementing this.
Thanks for the great example. Exactly what I'm hoping to do :thumbsup:
Be The Noise
-
Take a look at the Code Project Article FAQ[^] If you have the same code snippet shown in multiple languages (eg C# and VB versions of the same code) you can wrap muiltiple PRE blocks inside a <div class="code-samples"> and have the multiple code blocks appear in a tabbed form, similar to MSDN eg
<div class="code-samples">
<pre lang="C#">
...
</pre>
<pre lang="VB.NET">
...
</pre>
</div>Just make sure you set the lang attribute correctly
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
Chris Maunder wrote:
eg div class="code-samples">
FYI, as you have pasted it here, that page is missing a less than (<) before the "div" (and the "eg" should probably not be on the same line). Also, considering this is an HTML snippet, I'd think you would want to wrap it in a PRE block. :)
-
Take a look at the Code Project Article FAQ[^] If you have the same code snippet shown in multiple languages (eg C# and VB versions of the same code) you can wrap muiltiple PRE blocks inside a <div class="code-samples"> and have the multiple code blocks appear in a tabbed form, similar to MSDN eg
<div class="code-samples">
<pre lang="C#">
...
</pre>
<pre lang="VB.NET">
...
</pre>
</div>Just make sure you set the lang attribute correctly
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
:thumbsup:
Bill Gates is a very rich man today... and do you want to know why? The answer is one word: versions. Dave Barry Read more at [BrainyQuote](http://www.brainyquote.com/quotes/topics topic_technology.html#yAfSEbrfumitrteO.99)[^]
-
Take a look at the Code Project Article FAQ[^] If you have the same code snippet shown in multiple languages (eg C# and VB versions of the same code) you can wrap muiltiple PRE blocks inside a <div class="code-samples"> and have the multiple code blocks appear in a tabbed form, similar to MSDN eg
<div class="code-samples">
<pre lang="C#">
...
</pre>
<pre lang="VB.NET">
...
</pre>
</div>Just make sure you set the lang attribute correctly
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
Hi Chris, I asked the same question last week and was forwarded to this post. So I tried what you said and somehow failed miserably... :( Could you, or someone of the staff, an editor, please have a look at where I went wrong? This is the article that should now have tabbed code blocks, but hasn't... A Look under the hood of the .NET Framework[^] Thanks!
It's an OO world.
public class Naerling : Lazy<Person>{
public void DoWork(){ throw new NotImplementedException(); }
} -
Hi Chris, I asked the same question last week and was forwarded to this post. So I tried what you said and somehow failed miserably... :( Could you, or someone of the staff, an editor, please have a look at where I went wrong? This is the article that should now have tabbed code blocks, but hasn't... A Look under the hood of the .NET Framework[^] Thanks!
It's an OO world.
public class Naerling : Lazy<Person>{
public void DoWork(){ throw new NotImplementedException(); }
}All fixed.
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
-
All fixed.
cheers, Chris Maunder The Code Project | Co-founder Microsoft C++ MVP
Thanks Chris, looks great! :D
It's an OO world.
public class Naerling : Lazy<Person>{
public void DoWork(){ throw new NotImplementedException(); }
}
