Edycja nagłówka (zmiany przedstawione na screenie)

wersja skryptu MyBB:1.6.12
adres forum:handballpro.xaa.pl
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu):

Chciałbym zmienić swój nagłówek w ten sposób, ale kombinuję już od 4 godzin i bez skutku.

Tak to wygląda:


Tak powinno wyglądać:

.logo {
    background: url(images/revolver/css/bannerleft.png) no-repeat left, url(images/revolver/css/bannerright.png) no-repeat right, url(images/revolver/css/bannercenter.png) repeat-x center;
    box-shadow: 0px 1px 0px #fff;
    -moz-box-shadow: 0px 1px 0px #fff;
    -webkit-box-shadow: 0px 1px 0px #fff;
    height: 106px;
    margin: 1px;
}

<div class="uinfo">
    {$welcomeblock}
</div>

<div id="container">
        <a name="top" id="top"></a>
            <div id="header">
            <div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
            <div class="cmenu">
                <a href="{$mybb->settings['bburl']}/index.php">Strona Główna</a>
                <a href="{$mybb->settings['bburl']}/search.php">{$lang->toplinks_search}</a>
                <a href="{$mybb->settings['bburl']}/memberlist.php">{$lang->toplinks_memberlist}</a>
                <a href="{$mybb->settings['bburl']}/calendar.php">{$lang->toplinks_calendar}</a>
                <a href="{$mybb->settings['bburl']}/misc.php?action=help">{$lang->toplinks_help}</a>
            </div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
            {$pending_joinrequests}
            <navigation>
            <br />

Snake_ napisał 21.04.2014, 17:33:
Nieco poprawiam tytuł, zwięźlej.

Po prostu te dwie ikonki chcesz dodać? Daj do nich link. Zaraz Ci to zrobie

---

Na szybko zrobiłem coś takiego:



1. Przechodzisz do ACP → Szablony → [twój styl] → Nagłówek → header

2. Szukasz takiej linijki:

<div id="header"> 


3. Dodajesz przed nią:

<div class="facebook"><a href="LINK"><img src="http://icons.iconarchive.com/icons/graphics-vibe/retro-social/72/facebook-icon.png"></a></div><div class="youtube"><a href="LINK"><img src="http://icons.iconarchive.com/icons/graphics-vibe/retro-social/72/youtube-icon.png"></a></div> 


4. W global.css dodajesz na końcu:

.facebook {
    margin-top: 15px;
    float: right;
    width: 100px;
    height: 100px;
}

.youtube {
    margin-top: 15px;
    margin-right: -20px;
    float: right;
    width: 100px;
    height: 100px;
} 


GOTOWE!

To jest właśnie cały problem, który próbuje już od tych 4 godzin rozwiązać, dlaczego dzieje mi się coś takiego:

Wszystko zrobiłem tak jak napisałeś.

<div id="header"> 


3. Dodajesz przed nią:

Miałeś dodać przed tą linijką a nie za nią...

Dokładnie tak uczyniłem. Oto kod po zmianach:

<div class="uinfo">
    {$welcomeblock}
</div>
<div id="container">
        <a name="top" id="top"></a>
            <div class="facebook"><a href="https://www.facebook.com/forumhaxballa?ref=ts&fref=ts"><img src="/images/revolver/facebook.png"></a></div>
            <div class="youtube"><a href="LINK"><img src="/images/revolver/youtube.png"></a></div>
            <div id="header">
            <div class="logo"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" title="{$mybb->settings['bbname']}" /></a></div>
            <div class="cmenu">
                <a href="{$mybb->settings['bburl']}/index.php">Strona Główna</a>
                <a href="{$mybb->settings['bburl']}/search.php">{$lang->toplinks_search}</a>
                <a href="{$mybb->settings['bburl']}/memberlist.php">{$lang->toplinks_memberlist}</a>
                <a href="{$mybb->settings['bburl']}/calendar.php">{$lang->toplinks_calendar}</a>
                <a href="{$mybb->settings['bburl']}/misc.php?action=help">{$lang->toplinks_help}</a>
            </div>
        </div>
        <hr class="hidden" />
        <br class="clear" />
        <div id="content">
            {$pm_notice}
            {$bannedwarning}
            {$bbclosedwarning}
            {$unreadreports}
            {$pending_joinrequests}
            <navigation>
            <br />

Mój kod działa w 100% poprawnie. Dłubałeś coś przy klasie logo? Bo to ona tutaj wini.

Przed zmianą twój background w klasie logo wyglądał tak:

background: url(../../../images/revolver/css/bannerleft.png) no-repeat left, url(../../../images/revolver/css/bannerright.png) no-repeat right, url(../../../images/revolver/css/bannercenter.png) repeat-x center; 


Teraz wygląda nieco inaczej i dlatego nie wczytuje grafik:

background: url(../../../images/revolver/css/bannerleft.png) no-repeat left, url(images/revolver/css/bannerright.png) no-repeat right, url(images/revolver/css/bannercenter.png) repeat-x center; 


Coś zwaliłeś sobie podczas edycji global.css. Wgraj ten background z loga z przed zmiany i zobaczysz że będzie dobrze.

---

Łap, poprawiłem za ciebie cały global.css, TYLKO PODMIEŃ:

body {
    background: url(../../../images/revolver/css/bg.png) repeat-x top #cccccc;
    color: #929292;
    font-family: Lucida Sans, sans-serif;
    font-size: 12px;
    line-height: 1.4;
}

::selection {
    color: #fff;
    background: #9eb527;
}

::-moz-selection {
    color: #fff;
    background: #9eb527;
}

a {
    color: #9eb527;
    text-decoration: none;
    transition: color .2s linear;
    -moz-transition: color .2s linear;
    -webkit-transition: color .2s linear;
}

a:hover {
    color: #707070;
    text-decoration: none;
}

.uinfo {
    color: #adadad;
    text-shadow: 0px 1px 0px #fff;
    padding: 0px 13px 0px 13px;
    margin-top: -4px;
    margin-bottom: 12px;
}

.uinfo a {
    color: #949494;
}

.uinfo a:hover {
    color: #707070;
}

.uinfo .remember_me input {
    vertical-align: middle;
    margin-top: -1px;
}

#container {
    background: #f3f3f3;
    box-shadow: inset 0 0 0px 1px #fff, 0 0 0px 1px #fff, 0 0 3px 3px rgba(0,0,0,.2);
    -moz-box-shadow: inset 0 0 0px 1px #fff, 0 0 0px 1px #fff, 0 0 3px 3px rgba(0,0,0,.2);
    -webkit-box-shadow: inset 0 0 0px 1px #fff, 0 0 0px 1px #fff, 0 0 3px 3px rgba(0,0,0,.2);
    border: 1px solid #e2e2e2;
    width: 95%;
    margin: 40px auto;
}

.logo {
    background: url(../../../images/revolver/css/bannerleft.png) no-repeat left, url(../../../images/revolver/css/bannerright.png) no-repeat right, url(../../../images/revolver/css/bannercenter.png) repeat-x center; 
    box-shadow: 0px 1px 0px #fff;
    -moz-box-shadow: 0px 1px 0px #fff;
    -webkit-box-shadow: 0px 1px 0px #fff;
    height: 106px;
    margin: 1px;
}

.cmenu {
    background: url(../../../images/revolver/css/cmenuleft.png) no-repeat scroll left center, url(../../../images/revolver/css/cmenuright.png) no-repeat scroll right, url(../../../images/revolver/css/cmenucenter.png) repeat-x center;
    font-size: 14px;
    text-align:center;
    padding: 8px 8px 13px 8px;
}

.cmenu a {
    color: #c9c9c9;
    padding: 8px 32px;
}

.cmenu a:hover {
    background: url(../../../images/revolver/css/cmhleft.png) no-repeat left center, url(../../../images/revolver/css/cmhright.png) no-repeat right, url(../../../images/revolver/css/cmhcenter.png) repeat-x center;
    color: #9d9d9d;
    padding-bottom: 19px;
}

#content {
    height:1%;
    padding:0 1%;
}

.tborder {
    background: #E2E2E2;
    box-shadow: 0 0 0px 1px #E2E2E2;
    -moz-box-shadow: 0 0 0px 1px #E2E2E2;
    -webkit-box-shadow: 0 0 0px 1px #E2E2E2;
    width: 100%;
    margin: auto auto;
    border: 1px solid #fff;
}

.thead {
    background: url(../../../images/revolver/css/h2left.png) no-repeat top left, url(../../../images/revolver/css/h2right.png) no-repeat top right, url(../../../images/revolver/css/h2center.png) repeat-x;
    border: 1px solid #fff;
    box-shadow: inset 0 0 0px 1px #87a211;
    -moz-box-shadow: inset 0 0 0px 1px #87a211;
    -webkit-box-shadow: inset 0 0 0px 1px #87a211;
    color: #fff;
    font-weight: bold;
    font-size: 14px;
    text-shadow: 0px 1px 1px #5F830A;
    height: 40px;
    padding: 0;
    padding-left: 34px;
    margin: 0;
}

.thead a {
    color: #fff;
}

.tcat {
    background: url(../../../images/revolver/css/th.png) repeat-x top #e4e4e4;
    box-shadow: inset 0 0 0px 1px #fff;
    -moz-box-shadow: inset 0 0 0px 1px #fff;
    -webkit-box-shadow: inset 0 0 0px 1px #fff;
    text-shadow: 0px 1px 0px #fff;
}

.trow1, .trow2 {
    background:url(../../../images/revolver/css/tabletl.png) no-repeat top left, url(../../../images/revolver/css/tabletr.png) no-repeat top right, url(../../../images/revolver/css/tableb.png) repeat-x bottom #fff;
    box-shadow:inset 0px -1px 0px #fff;
    -moz-box-shadow:inset 0px -1px 0px #fff;
    -webkit-box-shadow:inset 0px -1px 0px #fff;
}

.trow_shaded {
    background: #FCF2F3;
}

.trow_selected td {
    background: #FFFBD9;
}

.trow_sep {
    background: #f5f5f5;
    box-shadow: inset 0px 1px 0px #fff;
    -moz-box-shadow: inset 0px 1px 0px #fff;
    -webkit-box-shadow: inset 0px 1px 0px #fff;
    text-shadow: 0px 1px 0px #fff;
    font-weight: bold;
}

.tfoot {
    background: url(../../../images/revolver/css/foot.png) repeat-x top #eaeaea;
    box-shadow: inset 0px 1px 0px #fff;
    -moz-box-shadow: inset 0px 1px 0px #fff;
    -webkit-box-shadow: inset 0px 1px 0px #fff;
    text-shadow: 0px 1px 0px #fff;
}

.bottommenu {
    background: url(../../../images/revolver/css/foottd.png) repeat-x top #fff;
    box-shadow: inset 0px 1px 0px #fff, 0px 1px 0px #fff;
    -moz-box-shadow: inset 0px 1px 0px #fff, 0px 1px 0px #fff;
    -webkit-box-shadow: inset 0px 1px 0px #fff, 0px 1px 0px #fff;
    border: 1px solid #e2e2e2;
    text-shadow: 0px 1px 0px #fff;
    text-align: center;
    padding: 5px;
    margin-bottom: 10px;
}

.bottommenu a {
    color: #949494;
}

.bottommenu a:hover {
    color: #707070;
}

.navigation {
    font-weight: bold;
    text-shadow: 0px 1px 0px #fff;
    height: 1%;
    padding: 10px 1%;
}

.smalltext {
    font-size: 11px;
}

.largetext {
    font-size: 16px;
    font-weight: bold;
}

fieldset {
    border: 1px solid #E2E2E2;
}

fieldset legend {
    background: #fff;
    border: 2px solid #E2E2E2;
    padding: 2px;
}

input, select, textarea {
    background: #f9f9f9;
    border-top: 1px solid #c1c1c1;
    border-left: 1px solid #d5d5d5;
    border-right: 1px solid #d5d5d5;
    border-bottom: 1px solid #e7e7e7;
    box-shadow: 0px 1px 0px rgba(255,255,255,.6);
    -moz-box-shadow: 0px 1px 0px rgba(255,255,255,.6);
    -webkit-box-shadow: 0px 1px 0px rgba(255,255,255,.6);
    font-family: Lucida Sans, sans-serif;
    font-size: 11px;
    color: #8c8c8c;
    padding: 3px 5px;
    vertical-align: middle;
}

input:focus, textarea:focus {
    background: url(../../../images/revolver/css/textbh.png) repeat-x top #fafafa;
    outline: 0;
}

textarea {
    line-height: 1.4;
}

button, .button, submit, .submit {
    background: url(../../../images/revolver/css/button.png) repeat-x top #f2f2f2;
    box-shadow: 0 0 1px 1px rgba(0,0,0,.15), inset 0 0 0px 1px #fff;
    -moz-box-shadow: 0 0 1px 1px rgba(0,0,0,.15), inset 0 0 0px 1px #fff;
    -webkit-box-shadow: 0 0 1px 1px rgba(0,0,0,.15), inset 0 0 0px 1px #fff;
    border: 0;
    color: #929292;
    text-shadow: 0px 1px 0px #fff;
    cursor: pointer;
    font-family: Lucida Sans, sans-serif;
    font-size: 11px;
    overflow: visible;
    width: auto;
    padding: 3px 5px;
    vertical-align: middle;
}

button:hover, .button:hover, submit:hover, .submit:hover {
    box-shadow:0 0 1px 1px rgba(0,0,0,.2), inset 0 0 0px 1px #fff;
    -moz-box-shadow:0 0 1px 1px rgba(0,0,0,.2), inset 0 0 0px 1px #fff;
    -webkit-box-shadow:0 0 1px 1px rgba(0,0,0,.2), inset 0 0 0px 1px #fff;
}

.editor {
    background: #f1f1f1;
    border: 1px solid #ccc;
}

.editor_control_bar {
    background: #fff;
    border: 1px solid #0f5c8e;
}

.autocomplete {
    background: #fff;
    border: 1px solid #000;
    color: black;
}

.autocomplete_selected {
    background: #adcee7;
    color: #000;
}

.popup_menu {
    background: #ccc;
    border: 1px solid #000;
}

.popup_menu .popup_item {
    background: #fff;
    color: #000;
}

.popup_menu .popup_item:hover {
    background: #C7DBEE;
    color: #000;
}

.invalid_field {
    border: 1px solid #f30;
    color: #f30;
}

.valid_field {
    border: 1px solid #0c0;
}

.validation_error {
    background: url(../../../images/invalid.gif) no-repeat center left;
    color: #f30;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-left: 22px;
}

.validation_success {
    background: url(../../../images/valid.gif) no-repeat center left;
    color: #00b200;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-left: 22px;
}

.validation_loading {
    background: url(../../../images/spinner.gif) no-repeat center left;
    color: #555;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-left: 22px;
}

/* Additional CSS (Master) */
img {
    border: none;
}

.clear {
    clear: both;
}

.hidden {
    display: none;
    float: none;
    width: 1%;
}

.hiddenrow {
    display: none;
}

.selectall {
    background-color: #FFFBD9;
    font-weight: bold;
    text-align: center;
}

.float_left {
    float: left;
}

.float_right {
    float: right;
}

.menu ul {
    list-style: none;
    margin: 0;
}

.menu li {
    display: inline;
    padding-left: 5px;
}

.menu img {
    padding-right: 5px;
    vertical-align: top;
}

#panel .links {
    margin: 0;
    float: right;
}

.expcolimage {
    float: right;
    width: auto;
    vertical-align: middle;
    margin-top: -2px;
    margin-right: 10px;
}

img.attachment {
    border: 1px solid #E9E5D7;
    padding: 2px;
}

hr {
    background: url(../../../images/revolver/css/hrleft.png) no-repeat left, url(../../../images/revolver/css/hrright.png) no-repeat right #eaeaea;
    border: 0;
    clear: both;
    color: #eaeaea;
    height: 1px;
}

#copyright {
    text-shadow: 0px 1px 0px #e1e1e1;
    color: #979797;
    font-size: 11px;
    text-align: center;
    margin-bottom: 40px;
}

#copyright a {
    color: #6c6c6c;
    font-weight: 700;
}

#copyright a:hover {
    color:#5b5b5b;
}

.user_info {
    background: #f8f8f8;
    box-shadow: inset 0px 1px 0px #fff, 0 0 1px 1px #e2e2e2, 0px 2px 1px #e2e2e2;
    -moz-box-shadow: inset 0px 1px 0px #fff, 0 0 1px 1px #e2e2e2, 0px 2px 1px #e2e2e2;
    -webkit-box-shadow: inset 0px 1px 0px #fff, 0 0 1px 1px #e2e2e2, 0px 2px 1px #e2e2e2;
    text-shadow: 0px 1px 0px #fff;
    padding: 7px;
    margin-right: 14px;
}

blockquote {
    color: #a6a6a6;
    border: 1px solid #e2e2e2;
    border-bottom: 2px solid #e2e2e2;
    border-left: 8px solid #e2e2e2;
    box-shadow: 0px 2px 2px rgba(0,0,0,.05);
    -moz-box-shadow: 0px 2px 2px rgba(0,0,0,.05);
    -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,.05);
    margin: 0;
    background: #fff;
    padding: 4px;
}

blockquote cite {
    font-weight: bold;
    border-bottom: 1px dashed #ededed;
    font-style: normal;
    display: block;
    margin: 4px 0;
}

blockquote cite span {
    float: right;
    font-weight: normal;
}

blockquote cite span.highlight {
    float: none;
    font-weight: bold;
    padding-bottom: 0;
}

.codeblock {
    background: #fff;
    border: 1px solid #ccc;
    padding: 4px;
}

.codeblock .title {
    border-bottom: 1px solid #ccc;
    font-weight: bold;
    margin: 4px 0;
}

.codeblock code {
    overflow: auto;
    height: auto;
    max-height: 200px;
    display: block;
    font-family: Monaco, Consolas, Courier, monospace;
    font-size: 13px;
}

.subforumicon {
    border: 0;
    vertical-align: middle;
}

.separator {
    margin: 5px;
    padding: 0;
    height: 0px;
    font-size: 1px;
    list-style-type: none;
}

form {
    margin: 0;
    padding: 0;
}

.popup_menu .popup_item_container {
    margin: 1px;
    text-align: left;
}

.popup_menu .popup_item {
    display: block;
    padding: 3px;
    text-decoration: none;
    white-space: nowrap;
}

.popup_menu a.popup_item:hover {
    text-decoration: none;
}

.autocomplete {
    text-align: left;
}

.subject_new {
    font-weight: bold;
}

.highlight {
    background: #FFFFCC;
    padding-top: 3px;
    padding-bottom: 3px;
}

.pm_alert {
    background: #FFF6BF;
    border: 1px solid #FFD324;
    text-align: center;
    padding: 5px 20px;
    margin-bottom: 15px;
    font-size: 11px;
}

div.error, .red_alert {
    background: #ec6363;
    border: 1px solid #cd3838;
    box-shadow: inset 0 0 0px 1px #fb8080, inset 0 0 0px 2px #df5555, inset 0 0 0px 3px #f26a6a, 0px 1px 0px #fff;
    -moz-box-shadow: inset 0 0 0px 1px #fb8080, inset 0 0 0px 2px #df5555, inset 0 0 0px 3px #f26a6a, 0px 1px 0px #fff;
    -webkit-box-shadow: inset 0 0 0px 1px #fb8080, inset 0 0 0px 2px #df5555, inset 0 0 0px 3px #f26a6a, 0px 1px 0px #fff;
    color: #fff;
    text-shadow: 0px 1px 1px #ac1e1e;
    padding: 10px 25px;
}

.pm_alert a, div.error a, .red_alert a {
    color: #fff;
}

.high_warning {
    color: #CC0000;
}

.moderate_warning {
    color: #F3611B;
}

.low_warning {
    color: #AE5700;
}

.online {
    color: #15A018;
}

.offline {
    color: #C7C7C7;
}

.pagination {
    padding-top: 10px;
    margin-bottom: 5px;
}

.tfoot .pagination, .tcat .pagination {
    padding-top: 0;
}

.pagination .pages {
    background: #fff;
    border: 1px solid #e2e2e2;
    box-shadow: 0px 1px 0px #fff;
    -moz-box-shadow: 0px 1px 0px #fff;
    -webkit-box-shadow: 0px 1px 0px #fff;
    padding: 2px;
}

.pagination .pagination_current, .pagination a {
    padding: 3px 5px;
    margin-bottom: 3px;
}

.pagination a {
    background: url(../../../images/revolver/css/pageleft.png) no-repeat top left, url(../../../images/revolver/css/pageright.png) no-repeat top right, url(../../../images/revolver/css/pagemid.png) repeat-x top center;
    color:#fff;
    text-shadow: 0px 1px 1px #637606;
    box-shadow: 0px 1px 0px #fff;
    -moz-box-shadow: 0px 1px 0px #fff;
    -webkit-box-shadow: 0px 1px 0px #fff;
    transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    -webkit-transition: opacity .2s linear;
}

.pagination .pagination_current {
    background: url(../../../images/revolver/css/bpleft.png) no-repeat top left, url(../../../images/revolver/css/bpright.png) no-repeat top right, url(../../../images/revolver/css/bpmid.png) repeat-x top center;
    color:#fff;
    text-shadow: 0px 1px 1px #454545;
    box-shadow: 0px 1px 0px #fff;
    -moz-box-shadow: 0px 1px 0px #fff;
    -webkit-box-shadow: 0px 1px 0px #fff;
    cursor: default;
}

.pagination a:hover {
    opacity: 0.75;
    -moz-opacity: 0.75;
    -webkit-opacity: 0.75;
    transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    -webkit-transition: opacity .2s linear;
}

.thread_legend, .thread_legend dd {
    margin: 0;
    padding: 0;
}

.thread_legend dd {
    padding-bottom: 4px;
    margin-right: 15px;
}

.thread_legend img {
    margin-right: 4px;
    vertical-align: bottom;
}

.forum_legend, .forum_legend dt, .forum_legend dd {
    margin: 0;
    padding: 0;
}

.forum_legend dd {
    float: left;
    margin-right: 10px;
}

.forum_legend dt {
    margin-right: 10px;
    float: left;
}

.success_message {
    color: #00b200;
    font-weight: bold;
    font-size: 10px;
    margin-bottom: 10px;
}

.error_message {
    color: #C00;
    font-weight: bold;
    font-size: 10px;
    margin-bottom: 10px;
}

.post_avatar img {
    border: 3px solid #fff;
    box-shadow: 0 0 1px 1px #e2e2e2, 0px 2px 2px #e2e2e2;
    -moz-box-shadow: 0 0 1px 1px #e2e2e2, 0px 2px 2px #e2e2e2;
    -webkit-box-shadow: 0 0 1px 1px #e2e2e2, 0px 2px 2px #e2e2e2;
}

.post_body {
    padding: 5px;
}

.post_content {
    padding: 5px 10px;
}

.quick_jump {
    background: url(../../../images/jump.gif) no-repeat 0;
    width: 13px;
    height: 13px;
    padding-left: 13px; /* amount of padding needed for image to fully show */
    vertical-align: middle;
    border: none;
}

.repbox {
    font-size:16px;
    font-weight: bold;
    padding:5px 7px 5px 7px;
}

._neutral {
    background-color:#FAFAFA;
    color: #999999;
    border:1px solid #CCCCCC;
}

._minus {
    background-color: #FDD2D1;
    color: #CB0200;
    border:1px solid #980201;
}

._plus {
    background-color:#E8FCDC;
    color: #008800;
    border:1px solid #008800;
}

.pagination_breadcrumb {
    background-color: #f5f5f5;
    border: 1px solid #fff;
    outline: 1px solid #ccc;
    padding: 5px;
    margin-top: 5px;
    font-weight: normal;
    white-space: nowrap;
}

.pagination_breadcrumb_link {
    vertical-align: middle;
    cursor: pointer;
}

.facebook {
    margin-top: 15px;
    float: right;
    width: 100px;
    height: 100px;
}

.youtube {
    margin-top: 15px;
    float: right;
    width: 60px;
    height: 60px;
} 


I poprawiłem klasę youtube, to teraz dwa się dobrze klikają.

Dziękuję za szybką pomoc! Zauważyłem, że w momencie, gdy dodaje nowe wzmianki typu ".facebook" czy ".youtube" i zapisuję szablon wtedy początek url (../../../) samoczynnie znika w całym pliku global.css Widocznie są jakieś błędy w stylu.