• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Position Absolute: height = 9px -> zu wenig??

Status
Für weitere Antworten geschlossen.
Player140

Player140

Neues Mitglied
Hi,

Ich habe folgendes in meinem Stylesheet stehen:


Code: 
#x105y173_814-9px_seperateLine01 { 
   background-image: url('style_pic/x105y173_814-9px_seperateLine01.png'); 
   position: absolute; 
      left:    105px; 
      top:    173px; 
      width:    814px; 
      height:   9px; 
   z-index: 40; 
}


und rufe es in meiner HTML Datei auf.
In Opera u. Mozilla wird das auch richtig dargestellt, allerdings habe ich Probleme im IE 6:
Die Grafik ist hier nicht wie angegeben 9 Pixel hoch, sondern ca doppelt so hoch.
Ich habe mal die Grafik ausgetauscht, aber es scheint eine mindestgrenze zu geben. Ist es wirklich nicht möglich hier weniger als ca 20px anzugeben? Oder liegt das Darstellungsproblem an etwas anderem?


Meine zweite Frage wäre, ob ich viele Hintergrundgrafiken die in meiner Homepage vorkommen immer im HTML aufrufen muss?
Ich habe ein relativ kompliziertes Hintergrunddesign z.B. mit mehreren Ecken und Rändern, was dann ca 6 bis 10 Grafiken ergibt, die ich alle in HTML so aufrufe:


Code: 
<div id = "x917y44_15-15px_leftCorner"> 
</div>    

    
<div id = "x105y173_814-9px_seperateLine01"> 
</div>    

usw. usw...

Kann ich das nicht gleich im CSS so definieren, dass die Hintergrundgrafiken einfach dargestellt werden, ohne diese nochmal in HTML aufzurufen? Würde ja viel dazu beitragen Style und Inhalt strikter zu trennen.

Vielen Dank für die Hilfe schonmal
 
Werbung:
1) hast du im div vielleicht ein

? das automatisch margin-top/bottom hat, so dass der div unmöglich 9px höhe haben kann?

ansonsten: ich verstehe deine probleme eigentlich nicht.

ps: du hast sehr komplizierte íd-namen, verwende lieber classes

div class="leftcorner"

das kannst du dann öfters auf einer seite verwenden und im css machst dú dann so

.leftcorner

und für den fall, dass darin wie gesagt ein

is machst du noch so:

.leftcorner p {
margin: 0px;
padding: 0px; }
 
Hm, ich hatte tatsächlich schon 2

´s in meiner Seite. Allerdings nicht in dem div, da hier wirklich nur die Grafik aufgerufen wird.

Das Problem ist einfach nur, dass die Grafik nur 9 PX hoch ist, also gebe ich in meinem Stylesheet auch 9px bei height an.

Code: 
#x105y173_814-9px_seperateLine01 { 
   background-image: url('style_pic/x105y173_814-9px_seperateLine01.png'); 
   position: absolute; 
      left:    105px; 
      top:    173px; 
      width:    814px; 
      height:   9px; 
   z-index: 40; 
}

Wenn ich die Seite dann im IE anschaue, dann ist die Grafik trotzdem höher als die 9 PX, nähmlich um die 18 px hoch.
In anderen Browsern stimmt alles, hier sind alle Grafiken so hoch wie sie sein sollen.
Wenn ich eine der anderen Grafiken auf einen niedrigen wert wie 9 setze, bei hight, dann sind auch diese nicht 9px hoch, sondern das selbe Problem ist vorhanden!


Was bringt es mir für Vorteile die Grafiken als Class zu definieren? Eine Möglichkeit die Hintergrundgrafiken einfach NUR im CSS zu haben, gibt es wohl wirklich nicht :( Ich brauche diese Grafiken ja auch nur einmal, für den Style.
 
Werbung:
Hi Player

Zum ersten Problem:
Das mit dem Abstand ist ein Bug im IE. Entweder fügst du Hacks zur Beseitigung ein oder lässt dir was anderes Einfallen.

Zur zweiten Frage:
Hintergrundgrafiken lassen sich natürlich rein durch CSS festlegen. Dann die CSS-Datei einbinden und fertig ist das Design. ;)
 
Ok, danke für die Info mit dem Bug, ich kann wohl einfach ein Blaues Feld drüber legen, dann sieht man es nicht mehr, oder ich mache die Grafik eben entsprechend größer, mal sehen.

Du schreibst ich kann die Hintergrundgrafiken natürlich rein durch CSS festlegen. Meinst du damit auch, dass ich dann in meiner HTML die CSS Datei nurnoch im Head einmal aufrufen muss!?
Wenn ja, dann wüsste ich gerne noch, als was ich dann die Elemente definieren muss, die für die Hintergrundgrafiken verantwortlich sind.
 
Player140 schrieb:
Du schreibst ich kann die Hintergrundgrafiken natürlich rein durch CSS festlegen. Meinst du damit auch, dass ich dann in meiner HTML die CSS Datei nurnoch im Head einmal aufrufen muss!?
Wenn ja, dann wüsste ich gerne noch, als was ich dann die Elemente definieren muss, die für die Hintergrundgrafiken verantwortlich sind.
Zum Vergrößern anklicken....

Also die CSS-Datei bindest du im HEAD der HTML-Datei ein. Im HTML Quelltxt hast du z.B. eine Div der gibts du eine ID. In der CSS-Datei verknüpfst du die ID mit einem Hintergrundbild.

Code: 
HTML:
<div id="navigation"> ... </div>

CSS:
#navigation { background-image:url(PFAD/DATEI.PNG); }

Also garnicht so schwer. ;)

Gruß
Hobbyuser
 
Werbung:
Jaja, klar, so mache ich das ja auch.
Ich meinte nur, wenn ich 8 Hintergrundbilder habe, dann muss ich das ganze ja 8 mal in meine HTML Datei einbinden. Obs da nicht etwas gibt, was Code erspart!?
 
Player140 schrieb:
Jaja, klar, so mache ich das ja auch.
Ich meinte nur, wenn ich 8 Hintergrundbilder habe, dann muss ich das ganze ja 8 mal in meine HTML Datei einbinden. Obs da nicht etwas gibt, was Code erspart!?
Zum Vergrößern anklicken....

HÄ? :?
Also entweder reden wir an einander vorbei oder ich verstehe dich nicht. :roll:

Hier nochmal ein Beispiel für 8 Grafiken mit Divs
HTML:
Code: 
<head>
  <link  rel="stylesheet" type="text/css" href="style.css">
  ...
</head>
<body>
  <div id="d1"> ... </div>
  <div id="d2"> ... </div>
  <div id="d3"> ... </div>
  <div id="d4"> ... </div>
  <div id="d5"> ... </div>
  <div id="d6"> ... </div>
  <div id="d7"> ... </div>
  <div id="d8"> ... </div>
  ...
</body>

Dann CSS (style.css)
Code: 
...
#d1 { background-image:url(PFAD/DATEI.png) }
#d2 { background-image:url(PFAD/DATEI.png) }
#d3 { background-image:url(PFAD/DATEI.png) }
...

Bei diesem Beispiel wird die CSS-Datei nur 1x pro Seite eingebunden. Das ganze ließe sich nur verkürzen wenn du immer das gleiche Bild im Hintergrund möchtest. Dann kannst du allen Divs die gleiche Klasse zuordnen (class="bildhinter") und brauchst in der CSS-Datei nur 1 Zeile.

Für weitere Hilfe solltest du mal die URL angeben, damit wir uns vielleicht besser verstehen. :wink:

Gruß
Hobbyuser
 
So wie du das mir beschreibst, als Code mache ich es ja auch.

Aber da was du drunter geschrieben hast, trifft genau das was ich möchte

hobbyuser schrieb:
Das ganze ließe sich nur verkürzen wenn du immer das gleiche Bild im Hintergrund möchtest. Dann kannst du allen Divs die gleiche Klasse zuordnen (class="bildhinter") und brauchst in der CSS-Datei nur 1 Zeile.
Zum Vergrößern anklicken....

Ich möchte auf all meinen Seiten die selben 8 Bilder im Hintergrund. Nie irgendwie mit Text vermischt ect..
Oder meinst du damit jetzt die eine Hintergrundgrafik die man für den Body definieren kann??
Hochladen kann ich das ganze leider nicht. Ich habe keinen anständigen Webspace, weis auch noch nicht woher nehmen u. nicht stehlen :?
 
Werbung:
Player140 schrieb:
Ich möchte auf all meinen Seiten die selben 8 Bilder im Hintergrund. Nie irgendwie mit Text vermischt ect..
Oder meinst du damit jetzt die eine Hintergrundgrafik die man für den Body definieren kann??
Zum Vergrößern anklicken....
Also dann ist das erste Beispiel das Richtige. Das Zweite würde nur zutreffen, wenn du für 8 Divs nur 1 Hintergrundbild möchtest.

Player140 schrieb:
Hochladen kann ich das ganze leider nicht. Ich habe keinen anständigen Webspace, weis auch noch nicht woher nehmen u. nicht stehlen :?
Zum Vergrößern anklicken....
Wenn du möchtest kann ich dir einen Webspace einrichten mit einer Sub-Domain (z.B. player.hobbyuser.de). Ich besitze einen Reseller-Account auf dem ich bis zu 20 Kunden anlegen kann.

Futures:
- Eigener FTP-Zugang
- PHP
- MySQL
- 100Mb Webspace
- 5 POP3-Postfächer
- Confixx 3.1
- etc.

Bei Intresse schicke mir eine PN mit deiner Email. Das Einrichten dauert etwa. 15 Minuten. ;)

Gruß
Hobbyuser
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben