Hallo erst mal...
wie bekomme ich das hin das bei einer kleineren breite zb. 780px zwei boxen nebeneinander sind und nicht nur eine.
Code
<div class="gridLayout row">
<div class="gridBox col-xs-6 col-md-3">
<h2 class="gridBoxTitle"> <span class="icon icon32 fa-gamepad"> </span> Konsolen</h2>
<div class="gridBoxContent">
<nav>
<ol class="gridBoxMenu">
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 1</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 2</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 3</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 4</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 5</span>
</a>
</li>
</ol>
</nav>
</div>
</div>
<div class="gridBox col-xs-6 col-md-3">
<h2 class="gridBoxTitle"> <span class="icon icon32 fa-desktop"> </span> Computer</h2>
<div class="gridBoxContent">
<nav>
<ol class="gridBoxMenu">
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 1</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 2</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 3</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 4</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 5</span>
</a>
</li>
</ol>
</nav>
</div>
</div>
<div class="gridBox col-xs-6 col-md-3">
<h2 class="gridBoxTitle"> <span class="icon icon32 fa-mobile"> </span> Smartphone</h2>
<div class="gridBoxContent">
<nav>
<ol class="gridBoxMenu">
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 1</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 2</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 3</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 4</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 5</span>
</a>
</li>
</ol>
</nav>
</div>
</div>
<div class="gridBox col-xs-6 col-md-3">
<h2 class="gridBoxTitle"> <span class="icon icon32 fa-newspaper-o"> </span> Sonstiges</h2>
<div class="gridBoxContent">
<nav>
<ol class="gridBoxMenu">
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 1</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 2</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 3</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 4</span>
</a>
</li>
<li class="">
<a href="#" class="gridBoxMenuLink">
<span class="gridBoxMenuLinkTitle">Link 5</span>
</a>
</li>
</ol>
</nav>
</div>
</div>
</div>
Alles anzeigen
MfG HTMH