positionierungs problem

[Daniel]

Hi,
ich habe ein bild das so aufgebaute ist:

Quicknavi      News
---------      ---------------------
| asdfa |      |                   |
---------      |                   |
               |                   |
---------      |                   |
| argdf |      |                   |
---------      |                   |
               |                   |
---------      |                   |
| dfggh |      |                   |
---------      |                   |
               |                   |
---------      |                   |
| ghjsd |      |                   |
---------      ---------------------

die seiten sind abgerundet. hab leider keine möglichkeit es on zu
stellen. Naja aufjedenfall sollen die News aktuell sein also div aufs
bild, damits mit der positionierung halbwegs klappt das img auch noch
in ein div. das Css sieht so aus:

  
<style type="text/css">  
    .bild {position: absolute; top: 8em; left: 19em; }  
    .news {position: absolute; top: 9em; left: 23em; text-align: left; width: 19em; overflow:auto; height: 18em; padding-left: 0; padding-right: 0;}  
    </style>  

dadurch hat das Div u.U. nen senkrechten scrollbalken und passt in den dafür vorgesehenen raum unter news. Allerdings finde ich diese lösung sehr unschön. zumal wenn man mit kleienrer auflösung fährt das ganze
irgendwann irgendwo gaanz unten rechts hängt. hatte für .bild auch
schon position relativ und es gecentert allerdings sah das dann im IE
recht bescheiden aus. Wie kann ich dieses bild mit divs faken? sonst
jmd nen andern verbesserungs vorschlag?

MfG

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Daniel
=> Hallo Daniel.

die seiten sind abgerundet.

Welche Seiten? Meinst du die Ecken?

Naja aufjedenfall sollen die News aktuell sein also div aufs
bild,

Diesen Zusammenhang kann ich nicht nachvollziehen.

damits mit der positionierung halbwegs klappt das img auch noch
in ein div.

Warum dies? Dass du ein img-Element ebenso wie alle anderen Elemente auch formatieren (also auch positionieren) kannst, ist dir entfallen?

<style type="text/css">

>     ~~~css

.bild {position: absolute; top: 8em; left: 19em; }  

>     .news {position: absolute; top: 9em; left: 23em; text-align: left; width: 19em; overflow:auto; height: 18em; padding-left: 0; padding-right: 0;}

~~~~~~html
  

>     </style>  
> 

Ich denke, dass du mit absoluter Positionierung sparsamer umgehen solltest, bevor dies zu einer Angewohnheit wird. Früher oder später wirst du die Probleme darin erkennen.

Du solltest vielleicht einen Blick auf das zweispaltige CSS-Layout aus dem SELFHTML-Kapitel der CSS-basierten Layouts werfen.

dadurch hat das Div u.U. nen senkrechten scrollbalken und passt in den dafür vorgesehenen raum unter news. Allerdings finde ich diese lösung sehr unschön. zumal wenn man mit kleienrer auflösung fährt das ganze
irgendwann irgendwo gaanz unten rechts hängt

Und zumal ein mit overflow:auto / scroll formatierter Bereich im FireFox nicht scrollbar ist, was mitunter sehr lästig sein kann.

Zudem hat die Darstellung nichts mit der Bildschirmauflösung, sondern vielmehr mit dem Viewport (dem zur Verfügung stehenden Platz) zu tun. Und dieser ist (so gut wie) immer geringer.

Einen schönen Freitag noch.

Gruß, Ashura

[Daniel]

Hi,

die seiten sind abgerundet.
Welche Seiten? Meinst du die Ecken?

Wenn ich nur die ecken abgerundet bekomme ist das nicht weiter
schlimm, beim bild sind die seiten links und recht gebogen.

Naja aufjedenfall sollen die News aktuell sein also div aufs
bild,
Diesen Zusammenhang kann ich nicht nachvollziehen.

na in das DIV kann ich per php einen beliebigen text einfügen den ich
aus einer DB hole, in ein bild nicht, und wenn dann ist das nicht
scrollbar.

Warum dies? Dass du ein img-Element ebenso wie alle anderen Elemente auch formatieren (also auch positionieren) kannst, ist dir entfallen?

gut möglich, allerdings soll das DIV mit den News ja an einer
bestimmten stelle über dem bild sein, da dacht ich es ist einfacher
das ganze nochmal in ein DIV zu packen, wobei ja der body zum
zusammenfassen reichen müsste da sonst nix auf der seite ist.

Ich denke, dass du mit absoluter Positionierung sparsamer umgehen solltest, bevor dies zu einer Angewohnheit wird. Früher oder später wirst du die Probleme darin erkennen.

na ich hat mit der relativen probleme.

Du solltest vielleicht einen Blick auf das zweispaltige CSS-Layout aus dem SELFHTML-Kapitel der CSS-basierten Layouts werfen.

werd ich gleich mal machen

Und zumal ein mit overflow:auto / scroll formatierter Bereich im FireFox nicht scrollbar ist, was mitunter sehr lästig sein kann.

also ich kann scrolen, nur halt nicht mitm scrollrad und das das nicht
geht weis ich, aber in meiner bekanntschaft nutzt das, vorallem die
älteren menschen eh keiner. und die hauptzielgruppe sind nunmal leute
um die 40.

Zudem hat die Darstellung nichts mit der Bildschirmauflösung, sondern vielmehr mit dem Viewport (dem zur Verfügung stehenden Platz) zu tun. Und dieser ist (so gut wie) immer geringer.

ja schon klar, ich hab auch nicht die auflösung veringert sondern das
browserfenster verkleinert.

dank dir schonmal für die 2 links

MfG

[Daniel]

Hi,
ich bin jetzt daran das bild in eine Div-suppe zu verwandeln. dabei stellt sich mir jetzt folgende probleme.

a) wie bekomm ich ein div zentriert? klar ich könnte eins drum rum setzten, denke aber das es ne bessere lösung gibt.

b) wie bekomme ich runde ecken hin?

MfG

[Gernot Back]

Hallo Daniel,

ich bin jetzt daran das bild in eine Div-suppe zu verwandeln. dabei stellt sich mir jetzt folgende probleme.

b) wie bekomme ich runde ecken hin?

Da du dich ja ohnehin für die DIV-Suppe entschieden hast, z.B. so:

http://aktuell.de.selfhtml.org/tippstricks/css/runde_ecken/index.htm

Es gibt aber auch noch Lösungsansätze ohne Grafiken, ich glaube mit noch mehr DIVs.

Gruß Gernot

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Gernot
=> Hallo Gernot.

Es gibt aber auch noch Lösungsansätze ohne Grafiken, ich glaube mit noch mehr DIVs.

Oder mit einer kurzen Zeichenkette: -moz-border-radius.

Wenn es doch nur schon alle könnten...

Einen schönen Freitag noch.

Gruß, Ashura

[Daniel]

Hi,

Oder mit einer kurzen Zeichenkette: -moz-border-radius.

so wie ich das sehe geht das nur im Mozilla?!?

MfG

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Daniel
=> Hallo Daniel.

Oder mit einer kurzen Zeichenkette: -moz-border-radius.

so wie ich das sehe geht das nur im Mozilla?!?

Richtig, wie ich bereits unterschwellig anmerkte:

Wenn es doch nur schon alle könnten...

Einen schönen Freitag noch.

Gruß, Ashura

[Gernot Back]

Hallo Ashura,

bist du umgestiegen auf Mozilla? Ich sehe auch in deiner Signatur keine Lobeshymnen mehr auf Opera!

Gruß Gernot

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Gernot
=> Hallo Gernot.

bist du umgestiegen auf Mozilla?

Nicht doch, wie käme ich denn dazu. ;-)

Ich sehe auch in deiner Signatur keine Lobeshymnen mehr auf Opera!

Wenn du auf das Banner anspielst: das ist schon seit Ewigkeiten weg.

Falls du meine remote-signature meinst: Zur Zeit gibt es anscheinend Verbindungsprobleme mit meiner Domäne.

Einen schönen Freitag noch.

Gruß, Ashura

[Daniel]

Hi,

Da du dich ja ohnehin für die DIV-Suppe entschieden hast, z.B. so:
http://aktuell.de.selfhtml.org/tippstricks/css/runde_ecken/index.htm

irgendwie hab ich das so nicht hinbekommen :( habs jetzt mit 3 bildern (oben, mitte unten).

Was muss ich tun damit das hintergrundbild nicht repeated sondern gestreckt wird?

MfG

[Daniel]

Hi,
also im groben und ganzen steht das jetzt. ich hab nurnoch 2 fragen

1. wie kann ich den scrollbalken des DIV's formatieren?
2. kann man das hintergrundbild verbreitern? also nach links bzw. rechts zerren? oder muss ich "neue" bildermachen und diese breiter?

MfG

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Daniel
=> Hallo Daniel.

1. wie kann ich den scrollbalken des DIV's formatieren?

Nein. Im IE (und manchen Browsern, sofern sie es zulassen) kannst du die Scrollbars des Dokumentes ändern. Für individuelle Elemente ist mir soweit nichts bekannt.

2. kann man das hintergrundbild verbreitern? also nach links bzw. rechts zerren? oder muss ich "neue" bildermachen und diese breiter?

Nein, mit CSS können keine Hintergrundbilder verzerrt werden. Du wirst wohl nicht um eine Anpassung der Hintergrundbilder umhin kommen.
Beachte aber hierbei unbedingt, dass du das passende Dateiformat wählen solltest.

Einen schönen Freitag noch.

Gruß, Ashura

[Daniel]

Hi,

1. wie kann ich den scrollbalken des DIV's formatieren?
   Nein. Im IE (und manchen Browsern, sofern sie es zulassen) kannst du die Scrollbars des Dokumentes ändern. Für individuelle Elemente ist mir soweit nichts bekannt.

jo, im FF gehts nicht, aber im IE geht http://de.selfhtml.org/css/eigenschaften/anzeigefenster.htm#scrollbar
div {  scrollbar-base-color:#BCCFBC;
       scrollbar-3d-light-color:#BCCFBC;
       scrollbar-arrow-color:#fff;
       scrollbar-darkshadow-color:#ACC0AC;
       scrollbar-face-color:#BCCFBC;
       scrollbar-highlight-color:#BFDABF;
       scrollbar-shadow-color:#ACC0AC;
       scrollbar-track-color:#B6CCB6;}
funktioniert im FF nicht :( gibts da keine andere möglichkeit? der
graue scrollbalken ist so hässlich!

Nein, mit CSS können keine Hintergrundbilder verzerrt werden. Du wirst wohl nicht um eine Anpassung der Hintergrundbilder umhin kommen.
Beachte aber hierbei unbedingt, dass du das passende Dateiformat wählen solltest.

was soll das denn heißen? da der IE bei PNG mit transparenz dumm macht
nimm ich Gifs. ist das ungeeignet? ich benutze sicherlich keine
bmp's. wenn dann was anderes wie GIF oder JPG dann PNG. lieg ich da
mit meiner einschätzung für passende Dateiformate im www etwa falsch?

MfG

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Daniel
=> Hallo Daniel.

gibts da keine andere möglichkeit?

Nein und das ist auch gut so.

der
graue scrollbalken ist so hässlich!

Für dich ja. Aber ich denke einfach mal, dass du die Seite nich nur für dich machst, nicht wahr? An meine Scrollbalken lasse ich niemanden, die bleiben wie sie sind.

(Wenn du die Optik des FF nicht magst, kannst du ihm ja einen anderen Skin verpassen.)

was soll das denn heißen? da der IE bei PNG mit transparenz dumm macht
nimm ich Gifs.

Bei Volltransparenten Bildern ist es egal, ob GIF oder PNG. Nur mit der Halbtransparenz hat der IE Probleme.

ist das ungeeignet? ich benutze sicherlich keine
bmp's.

Ist auch besser so, finde ich. ;-)

wenn dann was anderes wie GIF oder JPG dann PNG.

... anderes _als ...

lieg ich da
mit meiner einschätzung für passende Dateiformate im www etwa falsch?

Ich meinte nur:

Viele detailreiche Texturen / Fotos -----------> JPEG

Einfache Konturen und Formen, geringe Details -> GIF

Alphatransparenz ------------------------------> PNG

Andere Formate sind kaum der Rede wert, lediglich SVG wäre da noch hervozuheben, wenn es sich denn weiter verbreitet.

Einen schönen Freitag noch.

Gruß, Ashura

[Daniel]

Hi,

gibts da keine andere möglichkeit?
Nein und das ist auch gut so.

findest du? ich finde es wäre für ein einheitliche design angebracht
auch die scrollbalken farblich verändern zu können.

der graue scrollbalken ist so hässlich!
Für dich ja. Aber ich denke einfach mal, dass du die Seite nich nur für dich machst, nicht wahr? An meine Scrollbalken lasse ich niemanden, die bleiben wie sie sind.

also ein grauer scrollbalken in einer z.B. roten seite beist. ist die
seite in grau ist der graue scrollbalken sogar schön und passt zum
design der Seite.

(Wenn du die Optik des FF nicht magst, kannst du ihm ja einen anderen Skin verpassen.)

das bringt den usern die auf die von mir erstellte seite gehn
reichlich wenig. oder kann man einen link machen der dann den skin so
verändert das es zu den seitenfarben passt?

Bei Volltransparenten Bildern ist es egal, ob GIF oder PNG. Nur mit der Halbtransparenz hat der IE Probleme.

ahso, wiedermal was gelernt.

wenn dann was anderes wie GIF oder JPG dann PNG.
... anderes _als ...

GNARF

Ich meinte nur:

Viele detailreiche Texturen / Fotos -----------> JPEG
Einfache Konturen und Formen, geringe Details -> GIF

MONOCHROM -------------------------------------> GIF

Alphatransparenz ------------------------------> PNG

Einen schönen Freitag noch.

dir auch und ein schönes WE

MfG

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Daniel
=> Hallo Daniel.

findest du? ich finde es wäre für ein einheitliche design angebracht
auch die scrollbalken farblich verändern zu können.

Ja. Die Scrollbalken gehören zum GUI des Systems und nicht zu einem betrachteten Dokument. Sie sollten wie gewohnt aussehen.

also ein grauer scrollbalken in einer z.B. roten seite beist. ist die
seite in grau ist der graue scrollbalken sogar schön und passt zum
design der Seite.

Und wenn der Scrollbalken türkisgrün mit rosa Punkten ist?
Es gibt Dinge, auf die man als Webautor keinen Einfluss hat, bzw. die man einfach unangetastet lassen sollte.

(Wenn du die Optik des FF nicht magst, kannst du ihm ja einen anderen Skin verpassen.)

das bringt den usern die auf die von mir erstellte seite gehn
reichlich wenig.

Das habe ich auch nicht behauptet.

oder kann man einen link machen der dann den skin so
verändert das es zu den seitenfarben passt?

Himmel nein! Lass' doch endlich die GUI in Ruhe und tobe dich auf deiner Seite aus.

MONOCHROM -------------------------------------> GIF

Sinnfrei, da Monochrom in jedem X-beliebigen Bildformat verfügbar ist.

Einen schönen Freitag noch.

Gruß, Ashura

[Daniel]

Hi,

Ja. Die Scrollbalken gehören zum GUI des Systems und nicht zu einem betrachteten Dokument. Sie sollten wie gewohnt aussehen.

meines erachtens schon.

Und wenn der Scrollbalken türkisgrün mit rosa Punkten ist?
Es gibt Dinge, auf die man als Webautor keinen Einfluss hat, bzw. die man einfach unangetastet lassen sollte.

ich persöhnlich habe aber ein "anspruchsvolles Auge" und hätte gerne
das die seite in farblich harmonischem einklang ist. mag sein das dir
das egal ist, mir ist das wichtig. wenn die seite türkisgrün mit rosa
Punkten ist dann hat der scrollbalken das recht darauf es auch zu
sein, und wenn er grau ist passt er nicht ins bild.

das bringt den usern die auf die von mir erstellte seite gehn
reichlich wenig.
Das habe ich auch nicht behauptet.

das ist aber das was ich erreichen will, ein harmonisches farb"spiel"

Himmel nein! Lass' doch endlich die GUI in Ruhe und tobe dich auf deiner Seite aus.

würd ich gerne tun, aber scrollbalken kann man nicht verändern, daher
werd ich wohl in zukunft alle seiten in grautönen erstellen.

MONOCHROM -------------------------------------> GIF
Sinnfrei, da Monochrom in jedem X-beliebigen Bildformat verfügbar ist.

bilder mit wenig details kann man auch im jpg speichern aber egal.

MfG

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Daniel
=> Hallo Daniel.

Ja. Die Scrollbalken gehören zum GUI des Systems und nicht zu einem betrachteten Dokument. Sie sollten wie gewohnt aussehen.

meines erachtens schon.

Dann sind wir uns ja einig.

ich persöhnlich habe aber ein "anspruchsvolles Auge" und hätte gerne
das die seite in farblich harmonischem einklang ist. mag sein das dir
das egal ist, mir ist das wichtig.

Mir doch auch. Ich achte immer mehr auf ein harmonisches Zusammenspiel der Farben, was die Lesbarkeit und Augenfreundlichkeit erhöhen soll.

Himmel nein! Lass' doch endlich die GUI in Ruhe und tobe dich auf deiner Seite aus.

würd ich gerne tun, aber scrollbalken kann man nicht verändern, daher
werd ich wohl in zukunft alle seiten in grautönen erstellen.

Wenn du es gut machst, warum nich?

MONOCHROM -------------------------------------> GIF
Sinnfrei, da Monochrom in jedem X-beliebigen Bildformat verfügbar ist.

bilder mit wenig details kann man auch im jpg speichern aber egal.

Ich habe nichts Gegenteiliges behauptet, lediglich aufgezählt, was wofür normalerweise optimal ist.

Einen schönen Freitag noch.

Gruß, Ashura

[Daniel]

Hi,

Ich habe nichts Gegenteiliges behauptet, lediglich aufgezählt, was wofür normalerweise optimal ist.

und GIF ist AFAIK optimal für MONOCHROM und S/W bilder

MfG

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Daniel
=> Hallo Daniel.

Ich habe nichts Gegenteiliges behauptet, lediglich aufgezählt, was wofür normalerweise optimal ist.

und GIF ist AFAIK optimal für MONOCHROM und S/W bilder

Streite ich erst einmal nicht ab, da ich es nicht getestet habe.

Einen schönen Freitag noch.

Gruß, Ashura

[Ingo Turski]

Hi,

und GIF ist AFAIK optimal für MONOCHROM und S/W bilder

nein, diese Verallgemeinerung ist absolut falsch.
Zum einen hat gif max. 256 Farben, aber ein S/W-Bild kann weitaus mehr Abstufungen haben.
Zum anderen komprimiert gif nur Bilder mit relativ wenigen Details gut. Unabhängig von den Farben ist bei detailreichen Fotos ein verlustbehaftetes Komprimierungsformat wie JPEG sinnvoller, wenn man die Dateigröße für's Web reduzieren möchte.
Übrigens ist PNG bei detailärmeren größeren Bildern gif noch überlegen.

freundliche Grüße
Ingo