Seite 7 von 7

Re: Hintergrund dreigeteilt

Verfasst: 03.04.2010 23:28
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

Re: Hintergrund dreigeteilt

Verfasst: 03.04.2010 23:33
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?

Re: Hintergrund dreigeteilt

Verfasst: 29.04.2010 13:00
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:

Re: Hintergrund dreigeteilt

Verfasst: 30.04.2010 11:33
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 ]

Re: Hintergrund dreigeteilt

Verfasst: 01.05.2010 00:16
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