[3.2] Div über den ganzen Wrap - geht das?

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.3, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich sowie die URL vom betroffenen Forum.
Antworten
Benutzeravatar
Tastenplayer
Mitglied
Beiträge: 2054
Registriert: 02.07.2010 19:35
Wohnort: Zuchwil/SO - Schweiz
Kontaktdaten:

[3.2] Div über den ganzen Wrap - geht das?

Beitrag von Tastenplayer »

Hallo

Habe vermutlich eine sehr doofe Frage respektive ich denke es ist unmöglich.

Kann ich einen div über den ganzen Wrap machen? Meine Versuche sind leider alle fehlgeschlagen.
Versuch habe ich in overall_header.html gemacht. Müsste doch diese html Datei sein, oder?
Mein Effekt war leider am Ende des PC Bildschirms zu sehen und nicht über dem ganzen Wrap :D
Schlussendlich habe ich nur eine abgespeckte Version in der css direkt beim Wrap geschafft. [ externes Bild ]:D

Code: Alles auswählen

<div class="box effect8">
Das ist ein spezieller Shadow Border. Wo die div class hin muss - vor dem Wrap denke ich doch. Aber wo muss der Abschluss hin?

CSS

Code: Alles auswählen

* Effect 8
 * ===============================================*/
.effect8 {
	position:relative;
	-webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect8:before, .effect8:after {
	content:"";
	position:absolute;
	z-index:-1;
	-webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
	-moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
	box-shadow:0 0 20px rgba(0,0,0,0.8);
	top:10px;
	bottom:10px;
	left:0;
	right:0;
	-moz-border-radius:100px / 10px;
	border-radius:100px / 10px;
}
.effect8:after {
	right:10px;
	left:auto;
	-webkit-transform:skew(8deg) rotate(3deg);
	-moz-transform:skew(8deg) rotate(3deg);
	-ms-transform:skew(8deg) rotate(3deg);
	-o-transform:skew(8deg) rotate(3deg);
	transform:skew(8deg) rotate(3deg);
}
Code ist von hier https://codepen.io/haibnu/pen/FxGsI
Meine phpBB Styles & More
Be the best version of yourself rather than a bad copy of someone else!
Lehrling
Ehemaliges Teammitglied
Beiträge: 3833
Registriert: 15.01.2012 20:00
Kontaktdaten:

Re: [3.2] Div über den ganzen Wrap - geht das?

Beitrag von Lehrling »

Das hier [/div] muss in den overall_footer.html.
Benutzeravatar
Tastenplayer
Mitglied
Beiträge: 2054
Registriert: 02.07.2010 19:35
Wohnort: Zuchwil/SO - Schweiz
Kontaktdaten:

Re: [3.2] Div über den ganzen Wrap - geht das?

Beitrag von Tastenplayer »

Lehrling hat geschrieben:Das hier [/div] muss in den overall_footer.html.
Hab jetzt grad ne definitive lange Leitung
Das

Code: Alles auswählen

<div class="box effect8">
muss in overall_header und der Abschluss

Code: Alles auswählen

[/div]
in overall_footer. :-? Aber irgendwie ist es ja auch logisch. Der Wrap geht ja über das ganze Forum.
Na gut versuch ich morgen einfach mal. Aber auf jeden Fall wieder zuerst im Prosilver. Bei mir im Style hat es ja noch andere Sachen, da weiss man nie.

Edit: Es ist eben manchmal ziemlich schwierig, man versucht sich das als Ganzes vorzustellen, aber man denkt es irgendwie nicht bis zum Ende! Irgendwie lässt man sich von den dazwischen liegenden Dateien verwirren. Das war dann wohl auch so, als ich versuchte einen Style von A-Z neu aufzubauen und immer zwei Wrap erhielt :)

Edit: Hat trotzdem bisher nicht geklappt. Es gibt nur links und rechts aussen im Background einen Bogen, trotz

Code: Alles auswählen

[/div]
in overall_footer. :D . Aber klar, ich versuch das weiter.

Im Moment mit neuem Code sieht es langsam immer besser aus. Muss nur noch schauen, dass ich es links noch etwas weiter nach oben hinbekomme . Und klar, auch einmal nachsehen, wie das dann in uralt Browser aussieht. [ externes Bild ]

Code: Alles auswählen

.mytaste_wrap {
	background-color: #CCCCCC;
	background-image: url("./images/wrap.jpg");
	border-radius: 8px;
	margin: -11px auto 20px;
	max-width: 1320px;
	padding: 15px;
	box-shadow: 0 3px 25px #000;
	transition: all 0.7s linear;
	-webkit-transition: all 0.7s linear;
	-moz-transition: all 0.7s linear;
	-o-transition: all 0.7s linear;
	-ms-transition: all 0.7s linear;
}
Meine phpBB Styles & More
Be the best version of yourself rather than a bad copy of someone else!
Antworten

Zurück zu „Styles, Templates und Grafiken“