<div class="border-2 border-smoke rounded mb-8">
    <div class="md:flex">
        <div class="bg-smoke-lighter border-b-2 border-smoke md:w-1/2 md:border-b-0 md:border-r-2 md:border-smoke">
            <div class="px-4 py-3 bg-white font-semibold border-b-2 border-smoke-light text-smoke-darker">Default values</div>
            <pre class="bg-smoke markdown language-js"><code>{{ $default }}</code></pre>
        </div>
        <div class="bg-smoke-lighter md:w-1/2">
            <div class="px-4 py-3 bg-white font-semibold border-b-2 border-smoke-light text-smoke-darker">Customized example</div>
            <pre class="bg-smoke markdown language-js"><code>{{ $customized }}</code></pre>
        </div>
    </div>
</div>

<div class="border-2 border-smoke rounded mb-8">
    <div class="md:flex">
        <div class="w-1/2 bg-smoke-lighter border-b-2 border-smoke md:border-b-0 md:border-r-2 md:border-smoke">
            <div class="px-4 py-3 bg-white font-semibold border-b-2 border-smoke-light text-smoke-darker">Default values</div>
            <pre class="bg-smoke markdown language-js"><code>{{ $default }}</code></pre>
        </div>
        <div class="w-1/2 bg-smoke-lighter">
            <div class="px-4 py-3 bg-white font-semibold border-b-2 border-smoke-light text-smoke-darker">Customized example</div>
            <pre class="bg-smoke markdown language-js"><code>{{ $customized }}</code></pre>
        </div>
    </div>
</div>

--- 
+++ 
@@ -1,10 +1,10 @@
 <div class="border-2 border-smoke rounded mb-8">
     <div class="md:flex">
-        <div class="w-1/2 bg-smoke-lighter border-b-2 border-smoke md:border-b-0 md:border-r-2 md:border-smoke">
+        <div class="bg-smoke-lighter border-b-2 border-smoke md:w-1/2 md:border-b-0 md:border-r-2 md:border-smoke">
             <div class="px-4 py-3 bg-white font-semibold border-b-2 border-smoke-light text-smoke-darker">Default values</div>
             <pre class="bg-smoke markdown language-js"><code>{{ $default }}</code></pre>
         </div>
-        <div class="w-1/2 bg-smoke-lighter">
+        <div class="bg-smoke-lighter md:w-1/2">
             <div class="px-4 py-3 bg-white font-semibold border-b-2 border-smoke-light text-smoke-darker">Customized example</div>
             <pre class="bg-smoke markdown language-js"><code>{{ $customized }}</code></pre>
         </div>
Fix responsiveness of the customized config component
