Forum (wrap?) etwas nach unten verschieben. Wie?

[tb280971]

Super, eben funktioniert es bei mir auch.
Klasse Arbeit. Vielen Dank Lehrling.
Siehe hier --> [ externes Bild ]
Das einzigste jetzt noch ... der dunkle Hintergrund könnte etwas höher (also breiter nach unten) sein und die Schrift etwas nach unten. Am besten mittig.
Sieht noch etwas gedrückt aus.

[Lehrling]

probier das mal aus:
öffne wieder das Stylesheet der Erweiterung, also dieses pmregnotify.css und füge bei #infobar a, #infobar a:link, #infobar a:visited, #infobar a:active noch Folgendes ein: height: 60px; und padding-top: 2em;. Bei

Code: Alles auswählen

#intro{
    margin-top: 35px;
}

musst du dann den Wert anpassen. Bei mir sah es mit margin-top: 55px; gut aus.

[tb280971]

Ok, jetzt ist der dunkle Hintergrund größer und diesen kann ich mit height: 60px; einstellen so wie es passt.
Die margin-top: 55px; muss ich natürlich dann anpassen so wie ich es haben will.
Für was ist --> padding-top: 2em; ?
Leider kommt die Schrift nicht runter. Es hat sich nur der Balken vergrößert.

Edit:
Ich habe es hinbekommen. Jetzt sieht es perfekt aus.
So muss eure pmregnotify.css jetzt aussehen.

Code: Alles auswählen

    /**
    *
    * @package phpBB Extension - PM Notify & Guest Register bar
    * @copyright (c) 2015 dmzx - http://www.dmzx-web.net
    * @license http://opensource.org/licenses/gpl-2.0.php GNU General Public License v2
    * @Author Stoker - http://www.phpbb3bbcodes.com
    *
    */

    #intro{
            margin-top: 45px;
    }

    #info {
        overflow: visible;
        width: 100%;
        position: fixed;
        top: 0;
        left: 0;
        z-index:200;
        margin-top: -0.8em;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 1.5em;
       font-weight: bold;
    }

    #infobar a, #infobar a:link, #infobar a:visited, #infobar a:active {
    background-image: url("./images/pmreg.png");
    background-position: center bottom;
    background-repeat: repeat-x;
    border-bottom: 0.25em solid #fff;
    clear: both;
    color: #fff;
    height: 10px;
    display: block;
    float: left;
    padding: 1.85em 0;
    text-align: center;
    text-decoration: none;
    width: 100%;
    }

    #infobar a:hover {
        color: #fff;
       background-image: url("./images/pmreg.png");
       background-position: top;
       background-repeat:repeat-x;
       border-bottom: .25em solid #5E5E5E;
       cursor: pointer;
    }

    span.pm-mail {
       background: url("images/mail.png");
       background-repeat: no-repeat;
       padding: 20px 24px;
       vertical-align:middle;
    }

    span.pm-reg {
       background-repeat: no-repeat;
       padding: 20px 26px;
       vertical-align:middle;
    }

    span.padding {
       padding: 0 20px 0 20px;
    }

Wenn ihr die Boxen noch in der Leiste sehen wollt, dann müsst ihr in der pmregnotify.css das hier ändern -->

Code: Alles auswählen

span.pm-reg {
   background: url("images/reg.png");
   background-repeat: no-repeat;
   padding: 20px 26px;
   vertical-align:middle;
}

Also nur --> background: url("images/reg.png"); einfügen.
In dem Code oben fehlt --> background: url("images/reg.png");
Diesen habe ich gelöscht, weil mir das mit den Boxen nicht so gefallen hat.

Und die overall_header_body_before.html so -->

Code: Alles auswählen

<div class="responsive-hide">
<!-- IF not (S_USER_LOGGED_IN or S_IS_BOT or S_IN_UCP) and S_REGISTER_ENABLED -->
<div id="intro">
<div id="info">
<div id="infobar">
<a href="{U_REGISTER}"><span class="pm-reg"></span><span class="padding">{L_PMREGBAR_WELCOME} {SITENAME}. {L_PMREGBAR_REGISTER}</span><span class="pm-reg"></span></a>
</div>
</div>
</div>
<!-- ENDIF -->

<!-- IF not S_IS_BOT and S_USER_LOGGED_IN and S_DISPLAY_PM and (S_USER_NEW_PRIVMSG or S_USER_UNREAD_PRIVMSG or U_AJAX_BASE_PRIVATEMSGS) -->
<div id="intro">
<div id="info">
<!-- IF S_USER_NEW_PRIVMSG or S_USER_UNREAD_PRIVMSG -->
<div id="infobar">
<a href="{U_PRIVATEMSGS}"><span class="pm-mail"></span><span class="padding">{L_PMREGBAR_HELLO} {S_USERNAME} {L_PMREGBAR_YOUHAVE} {PRIVATE_MESSAGE_COUNT} {L_PMREGBAR_PM}</span><span class="pm-mail"></span></a>
</div>
<!-- ENDIF -->
</div>
</div>
<!-- ENDIF -->
</div>

Ich danke allen noch einmal für eure tolle Hilfe.

[Talk19zehn]

Glückwunsch, es ist nicht immer einfach HTML korrekt zu verschachteln, CSS anzuwenden. Lehrling hat ja genial ergänzend strukturiert vorgelegt!! Manchmal ist die Lösung so nah ...
Dank an Lehrling!! Gut durchdacht!!!
Leider streikt meine DB nach wie vor, um es "nachzubauen" (und zwar nur bei jener Extension)... Sachen gibt´s ...

LG

Edit: 04.02.2016 18:55
Wo kann man sich denn das Endergebnis direkt mal anschauen? Link zum Forum ... ?


Dir, viel Glück!!