Willkommen in der Webstatt Zum Webstatt Blog und Stories
BNightSpeeder am 01.10.06 13:32

Hallo,

ich habe ein div Problem, also das ist mein Div:

<div id="div_m" align="center">
<div id="div_oben_links">1</div><div id="div_oben_rechts">1</div>
</div>


CSS Code:

#div_m {
width:682px;
background-color: #404040;
}

#div_oben_links {
text-align: left;
background: left top;
background-image: url(images/box/box_oben_links.gif);
background-repeat: no-repeat;
}

#div_oben_rechts {
text-align: right;
background: right top;
background-image: url(images/box/box_oben_rechts.gif);
background-repeat: no-repeat;
}

Eigentlich sollte ein Bild links oben und eins rechts oben angezeigt werden, doch leider ist das was rechts oben sein sollte nicht oben in der ecke sondern rechts unter der ecke also am besten zeigts der Anhang.

Hoffentlich kann mir jemand dabei helfen. Auf css4you habe ich jetzt seit 2 Stunden gesucht aber es hat nichts geholfen.

Mfg. BNS

netcup.de Warum gibt es hier Werbung?
fish fish am 01.10.06 13:38

schonmal mit float probiert?

Michael Michael am 01.10.06 13:42

Genau, beiden DIVs float: left; und schon sind sie nebeneinander

BNightSpeeder am 01.10.06 14:04

thx.

Nun noch ein Problem das selbe will ich auch für unten machen aber da geht es nicht:
Irgendwie dachte ich CSS ist einfacher :( :(

DIV:

<div id="div_m" align="center">
<div id="div_oben_links">LOLOLO</div><div id="div_oben_rechts">LOLOLO</div>
<br><br>
<div id="div_unten_links">LOLOLO</div><div id="div_unten_rechts">LOLOLO</div>
</div>


CSS.

#div_m {
width:682px;
background-color: #404040;
}

#div_oben_links {
float: left;
text-align: left;
background: left top;
background-image: url(images/box/box_oben_links.gif);
background-repeat: no-repeat;
}

#div_oben_rechts {
float: right;
text-align: right;
background: right top;
background-image: url(images/box/box_oben_rechts.gif);
background-repeat: no-repeat;
}

#div_unten_links {
float: left;
text-align: left;
background: left bottom;
background-image: url(images/box/box_unten_links.gif);
background-repeat: no-repeat;
}

#div_unten_rechts {
float: right;
text-align: right;
background: right bottom;
background-image: url(images/box/box_unten_rechts.gif);
background-repeat: no-repeat;
}

fish fish am 01.10.06 14:59

stimmen die bilderpfade?

BNightSpeeder am 01.10.06 15:03

ja, ich dachte auch zuerst es leigt an den Pfaden aber sie sind richtig!

fish fish am 01.10.06 15:34

lad mal hoch... ich will das mal in sehen...

BNightSpeeder am 01.10.06 15:37

Den Code?

<div id="div_m">
<div id="div_oben_links">LOLOLO</div>
<div id="div_oben_rechts">LOLOLO</div>
<br><br>
<div id="div_unten_links">LOLOLO</div>
<div id="div_unten_rechts">LOLOLO</div>
</div>



#div_m {
width:682px;
position: absolute;
margin-left: -341px;
left: 50%;
background-color: #404040;
}

#div_oben_links {
float: left;
text-align: left;
background: left top;
background-image: url(images/box/box_oben_links.gif);
background-repeat: no-repeat;
}

#div_unten_links {
float: left;
text-align: left;
background: left bottom;
background-image: url(images/box/box_unten_links.gif);
background-repeat: no-repeat;
}

#div_oben_rechts {
float: right;
text-align: right;
background: right top;
background-image: url(images/box/box_oben_rechts.gif);
background-repeat: no-repeat;
}

#div_unten_rechts {
float: right;
text-align: right;
background: right bottom;
background-image: url(images/box/box_unten_rechts.gif);
background-repeat: no-repeat;
}

Scraper Scraper am 01.10.06 16:52

Lad mal als Beispiel hoch, nicht nur den Quelltext.

BNightSpeeder am 01.10.06 16:56

EDIT//

Gut hier: http://victorvici.vi.funpic.de/123/download.html

Al3x0r Al3x0r am 01.10.06 17:00

Ein Beispiel du Nase. die Datei auf den Webspace und den Link ins Forum...

Scraper Scraper am 01.10.06 23:11

Aiaiai, das wird schon richtig angezeigt, allerdings aufgrund deiner Background-Positionierung so verschoben, dass man nur das schwarze sieht. Schneide entweder das Schwarze aus deinen Bottom-Grafiken raus, oder gib deinen beiden Bottom-Boxen mal height: 116px;

BNightSpeeder am 02.10.06 10:12

thx. Kann man es auch machen das das Bild immer ganz angezeigt wird?
Also das ich nicht immer height: 116px; machen muss.

Scraper Scraper am 02.10.06 18:54

ja, wenn du das Bild per IMG-Tag einfügst. Du hast nur ein Hintergrundbild definiert, und das passt sich der Größe der Box an, und nicht anders herum.

Creative Commons Lizenzvertrag
Alle Inhalte des Webstatt-Archivs stehen unter einer Creative Commons Namensnennung - Weitergabe unter gleichen Bedingungen 3.0 Unported Lizenz.

Impressum & Kontakt