| Autor |
Nachricht |
DrRSatzteil
Threadersteller
Dabei seit: 15.01.2006
Ort: Bamberg in Franken
Alter: 26
Geschlecht: 
|
Verfasst So 15.01.2006 03:08
Titel Mitvergrössernder Rahmen (HTML) |
  |
|
Hallo miteinander!
Ich habe ein Problem das mit jetzt seit 2 Tagen den Schlaf raubt... Ich will ein Layer mit Text, Formularen, oder sonst was mit einem Rahmen umschliessen der sich bei Erhöhung der Schriftgrösse mitvergrössert, bzw. den ich allgemein für jedes Div unabhängig von dessen Grösse verwenden kann.
Der folgende Code funktioniert ausgezeichnet in Firefox, im IE jedoch werden oberer und unterer Balken jedoch bis zum Seitenende lang gezogen und die senkrechten Balken erscheinen überhaupt nicht.
| Code: |
<div id="borderlayer0" style="position: absolute; left: 200px; top: 100px;">
<div style="margin: 25px; margin-bottom: 0px;">CONTENT</div>
<div id="topbar0" style="position: absolute; top: 0px; background-image: url(images/bar_top.gif); background-repeat: repeat-x;"><img src="images/left_upper_cornerb.gif" align="left"><img src="images/right_upper_cornerb.gif" align="right"></div>
<div id="bottombar0" style="position: absolute; bottom: -26px; background-image: url(images/bar_bottom.gif); background-repeat: repeat-x"><img src="images/left_lower_cornerb.gif" align="left"><img src="images/right_lower_cornerb.gif" align="right"></div>
<div id="leftbar0" style="position: absolute; top: 13px; height: 100%; background-image: url(images/bar_left.gif); background-repeat: repeat-y;"><img src="images/bar_left.gif"></div>
<div id="rightbar0" style="position: absolute; height: 100%; top: 13px; right: 0px; background-image: url(images/bar_right.gif); background-repeat: repeat-y;"><img src="images/bar_right.gif"></div>
</div>
|
Kennt jemand das Problem und einen workaround? Hätte ja auch per javascript den Code je nach browser angepasst aber habe noch keine funktionierende Konfiguration für den IE gefunden 
Vielleicht ist ja auch nur mein Ansatz zu schlecht 
Hoffentlich kann mir hier jemand helfen, danke.
Thomas
|
|
| |
  |
 |
Cocktailkrabbe
Dabei seit: 24.06.2002
Ort: 72116
Alter: 24
Geschlecht:
|
Verfasst So 15.01.2006 11:37
Titel
|
|
|
| DrRSatzteil hat geschrieben: | | Vielleicht kann das ja mal jemand verschieben |
Verschoben nach Allgemeines-Nonprint
Gruß
ck
|
|
| |
  |
|
beeviZ
Dabei seit: 30.09.2002
Ort: Dortmund
Alter: 17
Geschlecht:
|
Verfasst So 15.01.2006 16:07
Titel
|
|
|
wie wärs wenn sie einfach em angaben als rahmenbreite verwenden?
Zuletzt bearbeitet von beeviZ am Di 17.01.2006 23:12, insgesamt 1-mal bearbeitet
|
|
| |
|
|
DrRSatzteil
Threadersteller
Dabei seit: 15.01.2006
Ort: Bamberg in Franken
Alter: 26
Geschlecht:
|
Verfasst Di 17.01.2006 23:06
Titel
|
|
|
So, bin ein paar Tage nicht dazu gekommen.
Ok, da hast du natürlich recht. Nach längerem basteln hab ich jetzt auch eine Lösung mit der ich so einigermaßen leben kann...
Vielen Dank auf jeden Fall!
|
|
| |
|
|
beeviZ
Dabei seit: 30.09.2002
Ort: Dortmund
Alter: 17
Geschlecht:
|
Verfasst Di 17.01.2006 23:11
Titel
|
|
|
|
wär ja schon ganz cool wenn sie die lösung einmal posten könnten.
|
|
| |
|
|
DrRSatzteil
Threadersteller
Dabei seit: 15.01.2006
Ort: Bamberg in Franken
Alter: 26
Geschlecht:
|
Verfasst Mi 18.01.2006 00:24
Titel
|
|
|
Entschuldigung, natürlich:
| Code: | <div style="position: absolute; margin: 2em; margin-bottom: 0em;">
<div style="width: 30em; height: 40em;" /> <!-- LAYER MIT GRÖSSENANGABE -->
<div style="margin: 1em; margin-left: 1.5em;">
CONTENT
</div>
<div style="position: absolute; background-image: url(images/bar_top.gif); background-repeat: repeat-x; left: 0em; top: 0em; height: 1em; width: 100%;"></div>
<div style="position: absolute; background-image: url(images/bar_left.gif); background-repeat: repeat-y; left: 0em; top: 0em; height: 100%; width: 1em;"></div>
<div style="position: absolute; background-image: url(images/bar_right.gif); background-repeat: repeat-y; right: -1em; top: 0em; height: 100%; width: 1em;"></div>
<div style="position: absolute; background-image: url(images/bar_bottom.gif); background-repeat: repeat-x; left: 0em; bottom: -1em; height: 1em; width: 100%;"></div>
<div style="z-index: 1; position: absolute; background-image: url(images/left_upper_cornerb.gif); background-repeat: no-repeat; left: 0em; top: 0em; height: 1em; width: 1em;"></div>
<div style="z-index: 1; position: absolute; background-image: url(images/right_upper_cornerb.gif); background-repeat: no-repeat; right: -1em; top: 0em; height: 1em; width: 1em;"></div>
<div style="z-index: 1; position: absolute; background-image: url(images/left_lower_cornerb.gif); background-repeat: no-repeat; left: 0em; bottom: -1em; height: 1em; width: 1em;"></div>
<div style="z-index: 1; position: absolute; background-image: url(images/right_lower_cornerb.gif); background-repeat: no-repeat; right: -1em; bottom: -1em; height: 1em; width: 1em;"></div>
</div>
|
Wenn das mit dem Kommentar versehene <div>-tag nicht direkt wieder geschlossen wird ergeben sich im IE annähernd die gleichen Fehler wie zuvor, während der FF auch ohne diesen 'Trick' auskommt. Deshalb der content erst in dem layer darunter. Damit muss man zwar letztendlich immer den layer mit der Grösse mit angeben aber das ist in dem Fall wohl zu verschmerzen.
Dann danke ich ihnen trotzdem noch einmal für den Tipp, vielleicht sieht ja noch jemand eine Verbesserungsmöglichkeit 
EDIT: Habe den Code ausgetauscht. Jetzt verkleinern sich auch die Ecken mit. Das einzige Problem ist das der Aussenrand des rechten und unteren Balkens im FF bei starker Verkleinerung abgeschnitten werden
Zuletzt bearbeitet von DrRSatzteil am Mi 18.01.2006 00:36, insgesamt 3-mal bearbeitet
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
HTML Rahmen färben
[HTML] Rahmen um verlinktes Bild
HTML: können sich mehrere Zellen einen Rahmen teilen?
Anzeige in HTML aber ohne html ;-)
Rahmen um Bild...
Rahmen um Screenshot
|
|
Willkommen auf dem Portal für Mediengestalter
