Would it be possible to create a layout like this and how would you go about doing it? The container has borders, except at the top where the tabs are located. Only the selected tab should have a border at the top. The text on the tabs should be centered, although left alignment is also acceptable. However, the text on the first tab must not begin before the image (there should be equal spacing on the left).
The current HTML code appears as follows but can be modified if necessary:
<section class="grid-100 grid-parent tabs">
<header>
<ul>
<li class="selected">Tab1</li>
<li>Tab2</li>
<li>Tab3</li>
</ul>
</header>
<article class="tab visible">content</article>
<article class="tab">content</article>
<article class="tab">content</article>
</article>
</section>