07.12.2009, 12:13
|
|||
|
|||
runde ecken-variable Höhe, 3 Grafiken ineinander
Ich habe auf meinen Seiten versucht, ein Menu mit runden Ecken (per css im Hintergrund zugewiesen) einzubauen. Leider schiebt sich der mittlere Teil (der in der Höhe flexibel ist) auch bis oben und unten an den Rand.
Möglicherweise habe ich die Div´s falsch verschachtelt, gibt es evtl. eine Lösung das nur im css gerade zu biegen? Zusätzlich meckert der Validator .extramenutop Ungültige Nummer : background Einlese-Fehler [empty string] , dto für extramenubottom. die Seite (ihr könnt auch direkt mal schauen, ob meine "neue" css-Galerie einwandfrei arbeitet) Undercover-Coon's und der relevante css-Teil Code:
div#extranavi {
float : left;
width : 145px;
position: fixed;
top: 1%;
left: 1%;
}
.extramenu {
width : 140px;
background : url('/hp/extramenumitte1.jpg') repeat-y;
}
/*.extramenu*/ .extramenutop {
background : url('/hp/extramenutop.gif') no-repeat top;
text-align : center;
font-size : 20px;
font-style : italic;
font-weight : bold;
color : #ffffcc;
height : 22px;
}
/*.extramenu */.extramenubottom {
text-align : center;
color : #008080;
font-size : 1em;
background : url('/hp/extramenubottom.gif') no-repeat bottom;
}
Tanja 
|
| Sponsored Links |
|
07.12.2009, 13:51
|
||||
|
||||
|
|
| Sponsored Links |
|
07.12.2009, 14:56
|
|||
|
|||
|
die box braucht nur in der Länge flexibel sein; ich habe aber "transparente Ecken", da der eigentliche Hintergrund einen Farbverlauf hat. Ich habe das ganze schon auf allen Seiten eingebaut, deshalb wäre mir eine reine css-Korrektur lieber.
Auf der Beispielseite zieht sich der hellblaue, mitwachsende Hintergrund bis in die Ecken der abschließenden Grafiken (top+bot). Die beiden müsste ich auf Abstand bekommen... Tanja
|
|
07.12.2009, 15:16
|
||||
|
||||
|
wenn die Box nur in der Länge flexibel sein muss reicht Runde Ecken 2 aus.
Das der HG transparent sein finde ich unnötig. Du kannst doch den HG hernehmen und die obere und untere Grafik in PS an der entsprechenden Höhe draufziehen und dann ausschneiden. Das Gleiche für die untere Grafik. Ansonsten nimmst du halt einen Filter für den IE 6. 
|
|
07.12.2009, 15:26
|
|||
|
|||
|
ich weiß nicht, ob ich Dich jetzt richtig verstanden habe, aber ich soll keine transparenten Ecken machen sondern sie jeweils mit dem Farbverlauf anpassen? Dann bräuchten sie in der Höhe nicht flexibel sein....
Was ich so ergooglet habe, scheint es mit transparenten Ecken nicht so ohne weiteres zu gehen (es sei denn mit radius oder mit before/after, was ich aber aus Kompabilitätsgründen nicht nehmen möchte). Tanja Edit: habe erstmal in die transparenten Ecken einen farblichen Hintergrund gegeben, sieht aber nich auf allen Seiten so doll aus. und die Validitätsprobleme bleiben... Geändert von TanjaP. (07.12.2009 um 16:07 Uhr)
|
|
07.12.2009, 22:34
|
|||
|
|||
|
Zitat:
|
|
07.12.2009, 22:47
|
||||
|
||||
|
Ganz unabhängig davon empfehle ich, immer Zahlenwerte statt Schlüsselwörter einzusetzen - ist kürzer und spätestens wenn man mal definitiv einen Zahlenwert braucht (z.B. 10px oder .5em), sollte man die Schlüsselwörter eh durch Zahlenwerte ersetzen (denn einige ältere Browser mögen diesbzgl. keinen "Mix"), und muss dann nicht mehr lange überlegen, dass center zu 50% wird und right & bottom jeweils zu 100%
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
|
|
08.12.2009, 06:06
|
|||
|
|||
|
@fricca: Danke, genau diese Umstellung war´s!
@heiko_rs: aufräumen und diverse Werte ersetzen muss ich noch, aber erst mal sollte alles korrekt laufen. Ihr seid einfach klasse! Tanja
|
 |
| Themen-Optionen | |
| Ansicht | |
|
|
Ähnliche Themen
|
||||
| Thema | Autor | Forum | Antworten | Letzter Beitrag |
| Runde Ecken Problem | LuckyLuce | CSS | 9 | 16.12.2008 11:06 |
| error_reporting(E_ALL); | paracelsus | Serveradministration und serverseitige Scripte | 37 | 05.06.2008 07:36 |
| Safari und Opera (Mac) zeigen runde Ecken nicht an | Stefanie_K | CSS | 0 | 05.10.2006 14:03 |
| Runde Ecken, abstand zum Rand | denny | CSS | 0 | 04.06.2004 18:53 |
| Runde Box (bzw. runde Ecken) | l2107 | CSS | 3 | 08.02.2004 03:19 |
Linear-Darstellung
