galerie ordnet sich nicht rechts an

html.de-Forum HTML, XHTML & CSS
1

hallo allesamt,

ich versuche ein problem zu lösen, was mir einfach nicht gelingen mag.

ich habe einen bestimmten raum (680px) in zwei teile (500 + 180) geteilt. im linken teil (main_inhalt_23_1) ist viel text. im rechten teil (main_inhalt_23_2) möchte ich, dass eine kleine galerie angezeigt wird und zwar rechts vom text. wenn man dann über ein icon mit der maus fährt, poppt links das bild auf und zwar über den text.

leider lässt sich der galerienteil einfach nicht rechts von dem text anordnen, obwohl es mir scheint, dass ich keinen fehler gemacht habe. hier mal die code-schnippsel:

html:

[CODE]

gaaaaaaaaanz vieeeeeeeeeeeeeel text und so.

[/CODE]

css

[CODE]
#wrap {margin:0 auto; width:680px;}

#main {height:310px; padding:20px 20px;}

#main_inhalt_23_1 {width:500px; padding:0; margin:0; float:left;}

#main_inhalt_23_2 {padding:0; margin:0;}

#gallery {width:175px;}
#gallery ul {list-style:none; padding:0; margin:0; width:175px; position:relative;}
#gallery ul li {display:inline; width:42px; height:42px; float:left; margin:0 0 5px 5px;}
#gallery ul li a {display:block; width:40px; height:40px; text-decoration:none; border:1px solid #000;}
#gallery ul li a img {display:block; width:40px; height:40px; border:0;}
#gallery ul li a:hover {white-space:normal; border-color:#fff;}
#gallery ul li a:hover img {position:absolute; right:180px; top:0; width:auto; height:auto; border:1px solid #000;}[/CODE]

die galerie wird also immer unter dem textblock (main_23_1) angezeigt und nicht rechts davon. den fehler kann ich einfach nicht finden, da auf anderen html-dokumenten es auf diese weise klappt. superseltsam.

lösche ich den ganzen galerien-code (im html) und schreibe einfach nur einen text hinein, klappt es wieder und der neue text wird rechts von dem linken großen text angezeigt. nur mit der galerie will es nicht so recht klappen. :frowning:

kann mir vielleicht jemand sagen, was da falsch ist? mit direktem lösungsansatz, da ich leider nicht so firm in css bin. allein für das obige habe ich schon mehrere tage und 923435463545 google-suchen benötigt. :slight_smile:

schöne grüße
lules

2

ie geht, ff spinnt

ich habe die pixelmaße der galerie etwas heruntergeschraubt. es funktioniert nun in ie, aber nach wie vor nicht in ff. das kann ich
mir einfach nicht erklären. selbst, wenn ich auf lächerliche 100px runterfahre, will ff nicht funzen. die thumbnails werden dennoch immer unter dem linken block/text dargestellt.

#gallery {width:140px;} #gallery ul {list-style:none; padding:0; margin:0; width:140px; position:relative;} #gallery ul li {display:inline; width:37px; height:37px; float:left; margin:0 0 5px 5px;} #gallery ul li a {display:block; width:35px; height:35px; text-decoration:none; border:1px solid #000;} #gallery ul li a img {display:block; width:35px; height:35px; border:0;} #gallery ul li a:hover {white-space:normal; border-color:#fff;} #gallery ul li a:hover img {position:absolute; right:140px; top:0; width:auto; height:auto; border:1px solid #000;}

3

Wenn die Gallery rechts vom Inhalt stehen soll, müsstest du #main mit einem „float: left;“ und einer bestimmten Breite versehen.
Diesen div schließen, bevor #gallery geöffnet wird.

#gallery gibst du dann noch einen margin-left-Wert, welcher der Breite von #main zuzüglich dessen Paddingwerten (40px) entspricht.