Hintergrund dreigeteilt

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.0.x, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
phpBB Styles Demo
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
wrestling4you
Mitglied
Beiträge: 39
Registriert: 31.05.2009 11:52

Re: Hintergrund dreigeteilt

Beitrag von wrestling4you »

also einen Farbverlauf habe ich jetzt für das mittlere Bild eingestellt die anderen beiden Bilder sind 150 Pixel Breit und 1200 Hoch müsste ja reichen für den Rand oder? Das Beispiel Bild habe ich jetzt raus genommen. Und jetzt steht Links 2 Mal WWE Superstars (habe den Begriff im Header geändert) und es ist kein Bild zu sehen. ich kann aber per Rechtsklick die Grafik anzeigen lassen. Rechts wird nicht mal der Text angezeig
Benutzeravatar
Talk19zehn
Ehemaliges Teammitglied
Beiträge: 5041
Registriert: 08.06.2009 12:03

Re: Hintergrund dreigeteilt

Beitrag von Talk19zehn »

Ich beziehe mich auf diesen Beitrag: viewtopic.php?f=89&t=203495, den Du mit Deiner eingehenden Frage zitierst.

Aah ,- Du hast die Wrapper prozentual anders bemessen, daran liegt es.

Gehe bitte das Beispiel noch einmal durch und belasse die Prozentwerte der Wrapper. Ändern kannst Du die prozentualen Angabe der "Boxen". Jedoch ist auch hier Vorsicht geboten.

Wenn der Hintergrund der Wrapper gebildet wurde, fügst Du dann in den entsprechenden Boxen bspw. Dein Bild ein (vgl. bitte Inhalt Bildangabe / Beispiel). Nicht umgekehrt.
Bitte schaue Dir zusätzlich die Angaben zum Body und zum Wrap noch einmal an.

Beste Grüße




Entschuldigung an die Administration: Hier sind wir im falschen Thread. Vielleicht kann man die Diskussion abteilen und verschieben?
Adventereigniskalender für phpBB 3.3.x,
Meine persönliche Meinung im Jahr 2024: Im Zenit seiner Popularität wirkt KI zunächst wie eine Blaupause und lässt sich aufgrund der Vielschichtigkeit nicht auf eine einzige Botschaft reduzieren.
Benutzeravatar
WEEDman
Mitglied
Beiträge: 330
Registriert: 27.04.2005 18:37
Wohnort: in Brandenburg

Re: Hintergrund dreigeteilt

Beitrag von WEEDman »

Talk19zehn hat geschrieben:Dein Edit ---> Was soll eine derartige Bemerkung?
Deinen Beitrag kenne ich nicht und, was ich erarbeite, schreibe ich nirgends ab! Das, was hier gepostet ist, ist nichts, was die CSS - Welt nicht kennt. Sowas ist allgemein bekannt und auf zudem jeder guten Seite und in Büchern nachlesbar. :roll:
naja wenn man in einem Thread den gleichen Lösungansatz postet, den jemand im selben Thread ein paar Seiten vorher geschrieben hat, brauch man sich nicht hinstellen und sagen "hier ist mein Ansatz dafür" ;)
btw. habe ich nie behauptet, dass es war neues wäre, was die css-Welt nicht kennt. ich war bloß verwundert, dass du den selben Ansatz nocheinmal hingeschrieben hattest :lol:
MfG ~ 8)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
rofl
Benutzeravatar
7emper5i
Ehemaliger Übersetzer
Beiträge: 1473
Registriert: 11.04.2009 13:31
Wohnort: Köln
Kontaktdaten:

Re: Hintergrund dreigeteilt

Beitrag von 7emper5i »

Hi Jungs,

ich hab ebenfalls ein kleines Anliegen, was den selben Ansatz hat.

Allerdings soll bei mir der Inhalt im Wrapper durch einen Rahmen vom gesamten Hintergrund getrennt sein.

Funktioniert soweit, nur nicht der mittlere Inhalt.

Top Border - Left, center und right -> funktioniert

Center -> funktioniert nicht

Bottom Border - Left, center und right -> funktioniert.



Mein Anliegen also:

Wie definiere ich in nachfolgend gezeigter css-datei den Center Bereich so, dass er einen

linken Rand - mittleren Bereich - rechten Rand

erstellt.


Da ihr im Vorfeld mit divs gearbeitet habt, meine ich, dass dieser Lösungsansatz für mich nicht in Betracht kommt, da das eigentliche Layout ja schon steht und es sich hier nur um den Hintergrund innerhalb des Wrappers handelt.

Code: Alles auswählen

.top-left, .top-right, .bottom-left, .bottom-right {
    height: 20px;
	weidth: 20px;
    font-size: 2px;
}

.top-left {
	background-image: url("{T_THEME_PATH}/images/borders_tc.png"); background-repeat:no-repeat;
    background-position: 0 -20px;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 9px;
}
.top-right {
    background-image: url("{T_THEME_PATH}/images/borders_tc.png"); background-repeat:no-repeat;
    background-position: 100% 0;
    margin-left: 0px;
    margin-top: -9px;
    margin-right: 0px; 
}

.top-center {
    background-image: url("{T_THEME_PATH}/images/borders_02.png");
    background-position: 0 0px;
    height: 20px;
    weidth: 20px;
    font-size: 2px;
    margin-left: 20px;
    margin-top: -20px;
    margin-right: 20px;
    margin-bottom: -20px;
}

.bottom-left  {
	background-image: url("{T_THEME_PATH}/images/borders_bc.png"); background-repeat:no-repeat;
    background-position: 0 0px;
    margin-right: 0px;
    margin-left: 0px;
    margin-top: 0px;
}

.bottom-right {
    background-image: url("{T_THEME_PATH}/images/borders_bc.png"); background-repeat:no-repeat;
   background-position: 100% -20px;
    margin-right: 0px;
    margin-left: 0px;
    margin-top: -20px;
}

.bottom-center {
    background-image: url("{T_THEME_PATH}/images/borders_09.png");
    background-position: 0 0px;
    height: 20px;
    weidth: 20px;
    font-size: 2px;
    margin-left: 20px;
    margin-top: -20px;
    margin-right: 20px;
    margin-bottom: -20px;
}

.inside {
    border-left: 0px solid #ffffff;
    border-right: 0px solid #ffffff;
    color: #000000;
    padding-left: 5px;
    padding-right: 5px;
    background-image: url("{T_THEME_PATH}/images/borders_06.png");
}

Der Hintergrundbereich den ich meine wird im letzten Teil: .inside {...} definiert.

Aufgrund des absolut gefährlichen Halbwissens meine ich, dass ich da 3 neue Teile anlegen müsste: .. also

.inside_left
.inside_center
.inside_right


... und nun... brauch ich n Profi.. [ externes Bild ]
Die Deutsche Rechtschreibung ist Freeware, sprich, du kannst sie kostenlos nutzen. Allerdings ist sie nicht Open Source, d.h. du darfst sie nicht verändern oder in veränderter Form veröffentlichen.
Benutzeravatar
Talk19zehn
Ehemaliges Teammitglied
Beiträge: 5041
Registriert: 08.06.2009 12:03

Re: Hintergrund dreigeteilt

Beitrag von Talk19zehn »

Hallo 7emper5i,

wenn ich es korrekt deute, möchtest du dem eigentlichen Forum ( Wrap ) zusätzlich einen linken und rechten Rand geben.

Deine Angaben:

Code: Alles auswählen

.inside {
    border-left: 0px solid #ffffff;
    border-right: 0px solid #ffffff;
Wie wäre es, wenn du anstelle von 0px einen Wert von 10px ausprobierst? Das müsste doch gehen?



Oder Du gestaltest für das Forum ( Wrap ) zusätzlich einen Rahmen (?): Nur ein Denkansatz.

Theme

Code: Alles auswählen

#wrap {
   padding: 10px 10px 10px 10px;
   width: Deine_Angaben;
   border-top: 8px;
border-top-color: #010423;
border-top-style: outset;
border-top-width: 100%;
   border-left: 8px;
border-left-color: #008080;
border-left-style: outset;
border-left-width: 100%;
   border-right: 8px;
border-right-color: #660099;
border-right-style: outset;
border-right-width: 100%;
   border-bottom: 8px;
border-bottom-color: #990000;
border-bottom-style: outset;
border-bottom-width: 100%;   
}
Anstatt outset sind natürlich andere Variationen, wie bspw. solid denkbar: http://www.css4you.de/borderproperty.html

Ein weiteres Beispiel (andere "Kurz-Variante" vgl.: viewtopic.php?f=89&t=202700 ) für einen Rahmen.



Deine Notation: "weidth" ändere jeweils (sicherheitshalber) noch in width?


Beste Grüße
Adventereigniskalender für phpBB 3.3.x,
Meine persönliche Meinung im Jahr 2024: Im Zenit seiner Popularität wirkt KI zunächst wie eine Blaupause und lässt sich aufgrund der Vielschichtigkeit nicht auf eine einzige Botschaft reduzieren.
Antworten

Zurück zu „[3.0.x] Styles, Templates und Grafiken“