Witam, potrzebuję pomocy z "kontakt". Większość rzeczy jest już zrobiona, ale nie umiem "poukładać" tego w całość.
Tak to powinno wyglądać:
[
attachment=11932]
A aktualnie wygląda tak:
[
attachment=11933]
Podsyłam jeszcze fragment z index'u
Kod:
<tr>
<td class="trow1">
<img src="mpik.png" style="float:left;" />
<span style="background-image:url(http://bbhelp.pl/upload/files/gwiazdkired158_58584a7ce3b5b.gif);color:#ff0000; text-shadow: 0px 0px 6px #ff0000;"><i class="fa fa-star fa-spin" aria-hidden="true"></i> Właściciel</span><br>
<span style="background-image:url(http://bbhelp.pl/upload/files/gwiazdkired158_58584a7ce3b5b.gif);color:#ff0000; text-shadow: 0px 0px 6px #ff0000;"><i class="fa fa-star fa-spin" aria-hidden="true"></i> mpiK =D</span> <br>
<a href="http://forum-cs-snow.cba.pl/private.php?action=send&uid=10"><img src="koperta.png" alt="Prywatna Wiadomość" />Prywatna Wiadomość</a> <br>
<a href="http://steamcommunity.com/id/tenstyll4ever/"><img src="steam.png" alt="steam - mpiK =D" /> mpiK =D</a>
</td>
</tr>
Z góry dziękuje za każdą pomoc :*
Ten kod to..
W sumie, możesz dodać margin-left: 40px; do a ze steamem.
Pododawałem tą fraze, którą wysłałeś, kod wygląda teraz tak:
Kod:
<tr>
<td class="trow1"><br>
<img src="mpik.png" style="float:left;" />
<span style="margin-left: 5px;"><span style="background-image:url(http://bbhelp.pl/upload/files/gwiazdkired158_58584a7ce3b5b.gif);color:#ff0000; text-shadow: 0px 0px 6px #ff0000;"><i class="fa fa-star fa-spin" aria-hidden="true"></i> Właściciel</span><br>
<span style="margin-left: 5px;"> <span style="background-image:url(http://bbhelp.pl/upload/files/gwiazdkired158_58584a7ce3b5b.gif);color:#ff0000; text-shadow: 0px 0px 6px #ff0000;"><i class="fa fa-star fa-spin" aria-hidden="true"></i> mpiK =D</span> <br>
<span style="margin-left: 5px;"><a href="http://forum-cs-snow.cba.pl/private.php?action=send&uid=10"><img src="koperta.png" alt="Prywatna Wiadomość" />Prywatna Wiadomość</a> <br>
<span style="margin-left: 55px;"> <a href="http://steamcommunity.com/id/tenstyll4ever/"><img src="steam.png" alt="steam - mpiK =D" /> mpiK =D</a>
</td>
</tr>
Wygląda tak:
[
attachment=11940]
Dążę do:
[
attachment=11941]
Da radę jeszcze coś z tym zrobić? Wiem, że kod jest beznadziejny, ale w większości napisany przeze mnie, czyli osobę, która w swojej edukacji nie ma NIC związanego z komputerami i uczy się "w celu zabawy" nowych rzeczy.
pozdrawiam
Chodzi Ci o powiększenie czcionki i odstępy?
Jeśli tak to powiększ czcionke poprzez dodanie do span font-size: (LICZBA)px, a odstęp hm.. w tym wypadku użyj <br /> i tak jest syf.
https://jsfiddle.net/om1wggL1/
Masz pokazaną strukturę, duzo przerabiać nie trzeba.
Wymyśl sobie w głowie strukturę tego, a rozwiązanie niemalże samo przyjdzie.
Nie wiem czy to ja coś robie nie tak czy cos, bo na
https://jsfiddle.net/om1wggL1/ widze, jak to wygląda, ale po wklejeniu tego już jest coś nie tak, bo tekst się inaczej układa.
Cały czas coś z tym kombinuje i staneło na:
Kod:
<!----------------- KONTAKT START ----------------->
<table border="0" cellspacing="0" cellpadding="5" class="tborder">
<thead>
<tr>
<td class="thead">
<center><span>★ Kontakt ★</span></center>
</td>
</tr>
</thead>
<tbody>
<tr>
<td class="trow1">
<div class="staff">
<center> <h4 class="staff__title"><span style="background-image:url(http://bbhelp.pl/upload/files/gwiazdkired158_58584a7ce3b5b.gif);color:#ff0000; text-shadow: 0px 0px 6px #ff0000;"><i class="fa fa-star fa-spin" aria-hidden="true"></i> Właściciel</span></h4></center>
<div class="staff__avatar">
<img class="staff__avatar__image" src="http://forum-cs-snow.cba.pl/szymek.png">
</div>
<div class="staff__info">
<p class="staff__info__item"><span style="background-image:url(http://bbhelp.pl/upload/files/gwiazdkired158_58584a7ce3b5b.gif);color:#ff0000; text-shadow: 0px 0px 6px #ff0000;"><i class="fa fa-star fa-spin" aria-hidden="true"></i> SnowWolf</span></p>
<p class="staff__info__item"><a href="http://forum-cs-snow.cba.pl/private.php?action=send&uid=1"><img src="http://forum-cs-snow.cba.pl/koperta.png"/> Prywatna Wiadomość</a></p>
<p class="staff__info__item"><a href="http://steamcommunity.com/id/snowwolfik/"><img src="http://forum-cs-snow.cba.pl/steam.png" alt="steam - SnowWolf" /> SnowWolf</a>
</div>
</tbody>
</div>
<!----------------- KONTAKT END ----------------->
Wygląda tak:
[
attachment=11948]
Da się to wstawić przy zdjęciu? (Mam nadzieje, że nie namieszałem nic znowu i łatwo to naprawić
)
No, mimo wszystko, proponowałbym Ci, abyś dodał CSS:
.staff {
width: 100%;
padding: 0px 2px 9px 4px;
float: right;
background: black;
color: #f0f0f0;
box-sizing: border-box;
}
.staff:after {
display: table;
content: '';
clear: both;
}
.staff__title { color: red; text-shadow: 0 0 5px red; text-align: center; }
.staff__avatar { width: 30%; float: left; }
.staff__avatar__image { max-width: 100%; }
.staff__info { width: 70%; float: right; }
.staff__info__item { margin: 0; }