Mala pomoć oko pozicioniranja elemenata

Programiranje
1

Kolege pozdrav. Ako može pomoć oko pozicioniranja elemenata (u ovom slučaju responzivnih oglasnih jedinica).

Kod koji koristim za oglasne jedinice je

<div style="display:block; float:left; padding: 5px 5px 5px 0px;">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ************** -->
<ins class="adsbygoogle adslot_3"
 style="display:block"
 data-ad-client="ca-pub-***************"
 data-ad-slot="**********"
 data-ad-format="auto"></ins>

    <div style="display:inline; float:right; padding: 5px 0px 5px 5px;">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- ************* -->
<ins class="adsbygoogle adslot_4"
 style="display:block"
 data-ad-client="ca-pub-**************"
 data-ad-slot="**********"
 data-ad-format="Rectangle"></ins>

A u custom CSS u wordpress-u mi stoji ovaj kod

.adslot_3 {width: 300px; height: 250px;}
@media (min-width:768px) { .adslot_3 { width: 336px; height: 280px; } }
@media (min-width:1281px) { .adslot_3 { width: 336px; height: 280px; } }

.adslot_4 {width: 300px; height: 50px; }
@media (min-width:760px) { .adslot_4 { width: 300px; height: 250px;} }
@media (min-width:1281px) { .adslot_4 { width: 300px; height: 250px; } }

Oglasi se odlično prikazuju na desktop pregledniku, dok se u slučaju mobilnog ili tablet prikaza ipak ne poslože dobro. Znam da je greška u float:left & float:right atributima ali ne znam kako da dobijem da se u slučaju desktop browsera elementi poslože jedan do drugog, a u slučaju tableta & mobitela da idu jedan ispod drugog centrirani…

Evo i fotke da vidite na što mislim

Desktop

desk.jpg711×328 29.8 KB

Mobitel ili tablet

3

Custom CSS u wordpress-u zamijeni za ovaj kod:

.adslot_3 { width: 336px; max-height: 280px; } 
@media (max-width:768px) { .adslot_3 {  display: block; float: none; width: 100%; max-height: 280px; } }

.adslot_4 { width: 300px; height: 250px;}
@media (max-width:768px) { .adslot_4 {  display: block; float: none; width: 100%; max-height: 280px; } }
4

Hej, hvala na trudu ali neće tako da proradi.

Desktop radi ali se na mobilnom uopće ne pokazuju oglasne jedinice, samo prazan prostor…