Categorii in 2 siruri

Rezumarea primului mesaj :

ca in imagine doresc

https://i.imgur.com/K6WCPqo.png

nici o diferenta

Pofitim un cod pentru 6 link-uri

Cod:

<span style="float: left; width: 30%; margin-left: 5px;"><a style="float: left;" href="Link primul forum"><img alt="" src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/red01.png" /></a><a class="forumtitle" href="Link primul forum">Primul Forum</a><br /> Descriere primul forum</span> <span style="float: right; width: 35%; margin-left: 10px;"><a class="forumtitle" href="Link al doilea forum">Al doilea forum</a><br /> Descriere al doilea forum</span><a style="float: right;" href="Link al doilea forum"><img alt="" src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/green02.png" /></a> <br /> <span style="float: left; width: 30%; margin-left: 5px;"><a style="float: left;" href="Link forum 3"><img alt="" src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/orange03.png" /></a><a class="forumtitle" href="link forum3">Forum 3</a><br /> Descriere forum 3</span> <span style="float: right; width: 35%; margin-left: 10px;"><a class="forumtitle" href="link forum4">forum 4</a><br /> Descriere forum 4</span><a style="float: right;" href="link forum4"><img alt="" src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/darkblue04.png" /></a> <br /> <span style="float: left; width: 30%; margin-left: 5px;"><a style="float: left;" href="link forum 5"><img alt="" src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/green05.png" /></a><a class="forumtitle" href="link forum5">forum 5</a><br /> Descriere primul forum</span> <span style="float: right; width: 35%; margin-left: 10px;"><a class="forumtitle" href="link forum 6">Forum 6</a><br /> Descriere forum 6</span><a style="float: right;" href="link forum 6"><img alt="" src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/orange06.png" /></a>

Codul functioneaza 100% vezi aici Demonstratie live

dar de ce arata asa?

https://i.imgur.com/9PEzYJg.png

Poate browser-ul dumneavoastra trebuie actualizat sau schimbati rezolutia monitorului.
Eu le vad perfect la dumneavoastra pe forum,v-am identificat adresa forumului si nu vad nicio problema.

mr.franta a scris:Poate browser-ul dumneavoastra trebuie actualizat sau schimbati rezolutia monitorului.
Eu le vad perfect la dumneavoastra pe forum,v-am identificat adresa forumului si nu vad nicio problema.

am verificat si cu telefonul, la fel se vede

Am verificat cu o alta rezolutie pe forumul dvs si vad ca se deformeaza.
Ciudat este ca pe forumul meu de teste nu se deformeaza.
Este posibil ca latimea forumului sa fie de vina.
In continuare -am optimizat codul pentru subforumuri intr-unul unic sper sa va placa si sper sa functioneaze si la dvs ca la mine
Previzualizare

Adaugati acest cod in descrierea subforumului

Cod:

<div class="separator">
     <span style="float: left; width: 45%; margin-left: 5px;"><a href="Link primul forum" style="float: left;"><img src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/red01.png" alt="" /></a><a href="Link primul forum" class="forumtitle">Primul Forum</a><br /> Descriere primul forum</span> <span style="float: right; width: 45%; margin-left: 10px;"><a href="Link al doilea forum" class="forumtitle">Al doilea forum</a><br /> Descriere al doilea forum</span><a href="Link al doilea forum" style="float: right;"><img src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/green02.png" alt="" /></a>
</div>
<div class="separator">
     <span style="float: left; width: 45%; margin-left: 5px;"><a href="Link forum 3" style="float: left;"><img src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/orange03.png" alt="" /></a><a href="link forum3" class="forumtitle">Forum 3</a><br /> Descriere forum 3</span> <span style="float: right; width: 45%; margin-left: 10px;"><a href="link forum4" class="forumtitle">forum 4</a><br /> Descriere forum 4</span><a href="link forum4" style="float: right;"><img src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/darkblue04.png" alt="" /></a>
</div>
<div class="separator">
     <span style="float: left; width: 45%; margin-left: 5px;"><a href="link forum 5" style="float: left;"><img src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/green05.png" alt="" /></a><a href="link forum5" class="forumtitle">forum 5</a><br /> Descriere primul forum</span> <span style="float: right; width: 45%; margin-left: 10px;"><a href="link forum 6" class="forumtitle">Forum 6</a><br /> Descriere forum 6</span><a href="link forum 6" style="float: right;"><img src="https://cdn3.iconfinder.com/data/icons/mapicons/numeric/orange06.png" alt="" /></a>
</div>

Apoi adaugati in css acest cod

Cod:


.separator{
  display: inline-block;
  background: #141414;
  width: 99%!important;
  margin-bottom: 2px;
padding: 4px 0px;
  font-size: 12px;
  border: 1px solid #202020;
  box-shadow: 0px 0px 7px black inset;
  border-radius: 3px;
}

.separator:hover{
  background: #111;
}

SUPPPPPPEEEER!!! Va multumesc, mai ales pentru munca depusa si timpul acordat  
dar as avea o ultima rugaminte, daca se poate sa ingrosati textul unde scrie primul forum s.a.m.d si daca puteti sa scoateti bara aceea care e sub: primul forum, al doilea forum etc

Adaugati in css

Cod:


.separator a{
  font-family: sans-serif;
  font-weight: 600!important;
}

Nu uitati sa editati subiectul si sa il marcati cu si daca se poate sa apasati tasta multumesc

linia nu a fost scoasa si a disparut tabelul

Se poate sa fi gresit dvs ceva la codul css

verificati daca ati copiat corect codul

linile tot nu au disparut

Stergeti acest cod

Cod:

 
.separator a{
  font-family: sans-serif;
  font-weight: 600!important;
}

Si adaugatil pe acesta

Cod:

 
.separator a{
  font-family: sans-serif;
  font-weight: 600!important;
text-decoration: none!important;
}

Mare atentie cand copiati coduri css sa fie si parantezele acolade copiate,astfel se va destorsiona forumul.