nicht angemeldet
Zweizeilige Überschrift...
0 
JürgenB
0 0 JürgenB
0 
Gunnar Bittersmann
0 
Matthias Apsel
2 0 0 Matthias Apsel
0 0 
Camping_RIDER
0
Zweizeilige Überschrift...
Hallo,
was ich vorhabe sieht man hier.
Jetzt brauche ich nur noch in der ersten Zeile am Ende ein Padding - und das bekonmme ich einfach nicht hin.
Irgendwelche Vorschläge?
Ach ja - der Text muss komplett in einem Element enthalten sein, da er später über ein CMS gepflegt wird.
vg ichbinich
--
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...
-
Hallo ichbinich,
Irgendwelche Vorschläge?
inline -> inline-block
Gruß, Jürgen
-
Hallo,
Irgendwelche Vorschläge?
inline -> inline-blockNein, dann füllt die Hintergrundfarbe den Block, nicht nur den Text.
vg ichbinich
--
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...-
Hallo ichbinich,
inline -> inline-block
Nein, dann füllt die Hintergrundfarbe den Block, nicht nur den Text.dann habe ich dich falsch verstanden.
Gruß, Jürgen
-
-
-
-
Hallo,
Dann noch mal ausführlich für dich:
Ich versuche eine zweizeilige Überschrift zu "bauen". Nur der Text soll die Hintergrundfarbe haben, nicht der gesamte Block, in beiden Zeilen ringsherum ein padding und zusätzlich noch einen Abstand zwischen beiden Zeilen. Ebenso wie es jetzt bereits aussieht, nur das ich in der ersten Zeile am Ende noch ein padding brauche.Irgendwelche Vorschläge?
Das strong-Element ist falsch. Weg damit.Kannst du das auch begründen?
Und wozu das div?
Das ganze wird ein Element, in das neben der Überschrift auch noch Text, evtl. auch ein Bild, und ein Link hinein kommt. Deswegen schon mal ein div drumherum, prophylaktisch, testweise - wird je nach tatsächlicher späterer Verwendung section oder figure daraus werden...
vg ichbinich
--
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...-
Om nah hoo pez nyeetz, ichbinich!
Das strong-Element ist falsch. Weg damit.
Kannst du das auch begründen?strong hat die Bedeutung einen Teil des Fließtextes als besonders wichtig hervorzuheben. Du hast aber schon eine Überschrift. Wenn du einzusätzliches Element aus Gestaltungsgründen brauchst, dann nimm ein neutrales span.
Matthias
-
@@ichbinich:
nuqneH
Dann noch mal ausführlich für dich:
So verstehe ich das denn auch.
Ich versuche eine zweizeilige Überschrift zu "bauen". Nur der Text soll die Hintergrundfarbe haben, nicht der gesamte Block,
sondern „css background color for text only“. Begeben wir uns doch mal auf die Suche.
Chris Coyier aht hat immer ein paar CSS-Tricks auf Lager: Multi-Line Padded Text.
box-decoration-break*, das isses!
(In Dabblet verwende ich -prefix-free, evtl. brauchen einige Browser noch Präfixe.)
Qapla'
* In der Überschrift zeigen die Autoren Humor. ;-)
--
„Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
-
-
-
Om nah hoo pez nyeetz, ichbinich!
Ach ja - der Text muss komplett in einem Element enthalten sein, da er später über ein CMS gepflegt wird.
Wodurch ergibt sich der Zeilenumbruch?
Matthias
-
Hallo,
Ach ja - der Text muss komplett in einem Element enthalten sein, da er später über ein CMS gepflegt wird.
Wodurch ergibt sich der Zeilenumbruch?Durch die Breite des umgebenden Elementes, hier das div.
vg ichbinich
--
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...
-
-
-
Hi,
was ich vorhabe sieht man hier.
Jetzt brauche ich nur noch in der ersten Zeile am Ende ein Padding - und das bekonmme ich einfach nicht hin.
box-decoration-break wäre dafür die angebrachteste Möglichkeit, aber die Browser-Unterstützung ist m.E. noch nicht ausreichend.
Solange kann man sich bei simplen farbigen Hintergründen mit einem box-shadow behelfen: http://jsfiddle.net/6ba5xvwa/4/
MfG ChrisB
--
Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/-
Om nah hoo pez nyeetz, ChrisB!
box-decoration-break wäre dafür die angebrachteste Möglichkeit, aber die Browser-Unterstützung ist m.E. noch nicht ausreichend.
Solange kann man sich bei simplen farbigen Hintergründen mit einem box-shadow behelfen: http://jsfiddle.net/6ba5xvwa/4/
IE 10 und 11 könnte ein Hintergrundbild mit linear-gradient bekommen.
IE 8 und 9 positionierte Pseudoelemente.
Matthias
-
@@Matthias Apsel:
nuqneH
IE 8 und 9 positionierte Pseudoelemente.
?? Woher willst du wissen, wieviele es sein sollen, d.h. wieviele Zeilen die Überschrift hat?
IE 8 und 9 bekommen einfarbigen Hintergrund. Progressive enhancement at work.
Qapla'
--
„Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)-
Om nah hoo pez nyeetz, Gunnar Bittersmann!
IE 8 und 9 positionierte Pseudoelemente.
?? Woher willst du wissen, wieviele es sein sollen, d.h. wieviele Zeilen die Überschrift hat?Mehr als zwei geht ohnehin nicht. Progressive enhancement at work.
Wobei sich die Frage stellt, ob das den Aufwand wirklich Wert sein sollte.
Matthias
--
Der Unterschied zwischen Java und JavaScript ist größer als der zwischen Schach und Schachtelmacher.
-
-
-
Hallo,
box-decoration-break wäre dafür die angebrachteste Möglichkeit, aber die Browser-Unterstützung ist m.E. noch nicht ausreichend.
Sehe ich auch so, besonders da der Kunde auf einem IE8 testen wird...
Solange kann man sich bei simplen farbigen Hintergründen mit einem box-shadow behelfen: http://jsfiddle.net/6ba5xvwa/4/
Da fehlt leider das padding rechts in der ersten und lins in der zweiten Zeile.
Danke,
ichbinich--
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...-
Aloha ;)
box-decoration-break wäre dafür die angebrachteste Möglichkeit, aber die Browser-Unterstützung ist m.E. noch nicht ausreichend.
Sehe ich auch so, besonders da der Kunde auf einem IE8 testen wird...Bitte was? Lese ich da 'Optimierung für Windows XP-User'? Oder welchen sinnvollen Grund gibt es, warum kein neuerer IE eingesetzt werden kann und sollte?
Wenn sogar der Hersteller eines Systems empfiehlt, dieses nicht mehr zu verwenden, dann sollte man sich daran schon orientieren ;) (Letzteres trifft sowohl auf Windows XP als auch explizit auf den IE 8 zu...)
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
-
Hallo,
Bitte was? Lese ich da 'Optimierung für Windows XP-User'? Oder welchen sinnvollen Grund gibt es, warum kein neuerer IE eingesetzt werden kann und sollte?
Nein, kein XP, schon Windows7, aber ein vom Rechenzentrum kastrierter IE8, was anderes haben die Mitarbeiter dort nicht zur Verfügung... leider. Und deshalb muss die Seite nicht nur funktionieren im IE8 sondern auch aussehen wie designed.
vg ichbinich
--
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...-
Aloha ;)
Bitte was? Lese ich da 'Optimierung für Windows XP-User'? Oder welchen sinnvollen Grund gibt es, warum kein neuerer IE eingesetzt werden kann und sollte?
Nein, kein XP, schon Windows7, aber ein vom Rechenzentrum kastrierter IE8, was anderes haben die Mitarbeiter dort nicht zur Verfügung... leider. Und deshalb muss die Seite nicht nur funktionieren im IE8 sondern auch aussehen wie designed.ACK - vor allem das leider...
Am Sicherheitsproblem, das die Weiterverwendung von IE8 bedeutet, stört sich da niemand? Na dann :D
Grüße,
RIDER
--
Camping_RIDER a.k.a. Riders Flame a.k.a. Janosch Zoller
ch:? rl:| br:> n4:? ie:% mo:| va:) js:) de:> zu:) fl:( ss:| ls:[
-
-
-
Hi,
Solange kann man sich bei simplen farbigen Hintergründen mit einem box-shadow behelfen: http://jsfiddle.net/6ba5xvwa/4/
Da fehlt leider das padding rechts in der ersten und lins in der zweiten Zeile.Welches?
Wieso müssen wir wieder mal raten, was *genau* du eigentlich erreichen willst?
MfG ChrisB
--
Autocomplete has spoiled me to a point where it happens every so often that I encounter a CAPTCHA, and I just type in the first character … and then wait for the rest of the code to be automatically suggested :/-
Hallo,
Da fehlt leider das padding rechts in der ersten und lins in der zweiten Zeile.
Welches?Wieso müssen wir wieder mal raten, was *genau* du eigentlich erreichen willst?
Wieso raten? Was soll ich mehr erklären als das padding rechts in der ersten und padding links in der zweiten Zeile fehlt?
vg ichbinich
--
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...-
Hallo,
Wieso müssen wir wieder mal raten, was *genau* du eigentlich erreichen willst?
Wieso raten? Was soll ich mehr erklären als das padding rechts in der ersten und padding links in der zweiten Zeile fehlt?Nachtrag: fehlt nur im Firefox 35.
vg ichbinich
--
Kleiner Tipp:
Tofu schmeckt am besten, wenn man es kurz vor dem Servieren durch ein saftiges Steak ersetzt...
-
-
-
-