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

Positionierung von div Containern

donnerkai

Neues Mitglied
Hallo,

ich baue gerade eine Homepage für einen Bekannten.
Hierzug habe ich als Bild eine Holzplatte mit einem Loch hinterlegt und in dem Loch läuft (auf z index- 1 ) ein Slider durch.
Das funktioniert auch soweit.
Allerdings komme ich mit dem Positionieren nicht klar. Ich möchte erreichen, dass der Slider immer in dem Loch angezeigt wird.
Im Moment ist es so, dass bei Veränderungen der Größe des Browserfensters der Slider weg wandert.
Wie kann ich das verhindern?
Ausserdem habe ich das Problem, dass ich dem Slider keine width="25%" mitgeben kann. Sobald ich das ändere, wandert mir der komplette Slider unter das Brett, keine Ahnung warum.
Wer hat Tipps für mich?

hier der Link:
www.ln-holzbau.lima-city.de
 
Hallo,

na, der slider geht doch schon mal :O).

Du musst alles in ein div packen also
Code:
<center>
<div style="position:raltive">
...

DEINS ZWISCHEN DEN CENTER
...
</div>
</center>

dann musst das div mit den slider nur leicht ändern ist:
Code:
position:relative;width:350px;height:350px;top:-620px; left:-110px; z-index:-1; background:#ffffff;
soll (vielleicht)
Code:
position:abslolute;width:350px;height:350px;top:0px; left:0px; z-index:-1; background:#ffffff;

ps: die idee mit dem Holzbild ist ja ok aber das holzbild ist eher suboptimal da loch zu klein oder?

Cheffchen
 
Re:

ps: die idee mit dem Holzbild ist ja ok aber das holzbild ist eher suboptimal da loch zu klein oder?

Was meinst Du mit zu klein? Bei meinem 24 Zoll Monitor sieht es ganz OK aus. Ich habe es ja auf 80% stehen. Wenn ich es größer mache, 95 % oder so, wird mir bei Monitoren mit anderem Seitenverhältnis das Bild ja etwas gezerrt und somit nicht mehr darstellbar auf einer Seite.
Ich muss dann scrollen..
Das mit den Div`s probiere ich gleich mal aus, vielen Dank


Cheffchen[/QUOTE]
 
Das Bild Selber ist ungünstig, wie schon mal gesagt an anderer stelle mehr Holzhammer, dies sollte etwas feiner sein und vielleicht selbergezeichnet so das der rand nur ein rand ist und nicht 80% des bildes ist.


Die eigentlich größe meinte ich nicht und die kommt ja auf dem rest der homepage drauf an.

Cheffchen
 
Antwort und neue Frage

Also ich habe das Bild etwas zugeschnitten aber ganz ohne Rand geht es ja nicht weil es halt nicht ganz gerade ist.

Nun habe ich den Slider auch so hinbekommen, dass er sich mitbewegt und bei allen Größen immer an der selben Position zum Brett steht.
Das ist schonmal wunderbar :-)
;Jump

Allerdings bekomme ich es immer noch nicht richtig positioniert.
Ich hätte das Brett gerne vertikal zentriert und hab dazu auch schon verschiedene Threads gefunden. Leider funktioniert bei mir keiner der Tipps.
Zudem scheinen die Größenangaben im div Element des Hintergrundbildes ohne Wirkung zu bleiben. Ich wollte hier einen Höhe von 90% des Browserfensters
erreichen. Somit wäre das Bild immer komplett sichtbar ohne dass man scrollen muss wenn man eine kleine Auflösung eingestellt hat.
Leider scheint das Attribut height="90%" im div Container ohne Wirkung zu bleiben.

Ich raste noch aus....;ugl


Die eigentlich größe meinte ich nicht und die kommt ja auf dem rest der homepage drauf an.

Cheffchen[/QUOTE]
 
Also ich habe es jetzt einfach mit einer Breite in Prozent positioniert und ins center div geschoben. Das geht auch.
Allerdings scheint es mir unmöglich zu sein für alle Auflösungen eine optimale Darstellung zu erreichen.
Da bliebe wohl nur die Auflösung des Users mit JS auszulesen und dementsprechend ein jeweils angepasste Klasse im CSS aufzurufen...
Das ist mir aber zu aufwändig und zu kompliziert.
Dann muss ich wohl damit leben.
 
Hallo,

ohne Rand meinte ich nicht, sondern mehr das dies verhältnis Holz<>Loch bersser ist.

Hast div relativ drum rum und die bild und slider mit absolute gemacht?

vertikal zentriert, ist schrott und hat nur nachteile. spiel doch bloss mal gedanklich dorch wie das am netbook oder bei 24'' aussehen soll.
Das gleiche mit height="90%", das geht nicht.
Entscheide dich für eine größe, die am besten zum rest der Homepage passt und dann ist gut.

90% des Browserfensters erreichen. Somit wäre das Bild immer komplett sichtbar
autsch das beim 24'' da fällst vom stühl :O)

Cheffchen
 
Zurück
Oben