✔ Problem mit float

N

nchristoph

Erfahrenes Mitglied
Hallo zusammen,

ich bin gerade einbauen der Inhalte bei unserer Firmenseite.

Leider habe ich da mit der Galerie, speziell mit dem CSS ein paar Probleme

Hier mal der Code

CSS: 
.tx-rgsmoothgallery-pi1 {
  float:left;
}
 
#externalthumbs {
  float:left;
  width:360px;
}
 
#externalthumbs .label {
  display:none;
}
.carouselInner {
  width:365px;
}
 
.carouselInner .thumbnail {
  float:right;
  padding-bottom:10px;
}

Momentan schauts so aus wie im Screen.

Sobald ich die ganzen floats rausnehme, wird der Rahmen zwar komplett umschliessend, aber die Galerie wird auch nicht mehr richtig angezeigt.

Kann mir wer sagen, wie man das Fixen kann?
 

Anhänge

  • fehler.jpg
    fehler.jpg
    177,7 KB · Aufrufe: 21
Da du den HTML-Teil nicht gepostet hast kann ich nur raten: du hast nirgendwo nach einer float-Session ein
Code: 
clear: both;
stehen.
 
Das hier wäre der HTML Quellcode des betroffenen Bereiches.
HTML: 
<div id="c692" class="csc-default"><div class="tx-jfmulticontent-pi1">
		
<div id="jfmulticontent_c692">
	<ul>
		
		<li><a href="produkte/boeden/wohnkork/corkstone/#jfmulticontent_c692-1" rel="">Dekore</a></li>
		
		<li><a href="produkte/boeden/wohnkork/corkstone/#jfmulticontent_c692-2" rel="">Vorteile</a></li>
		
		<li><a href="produkte/boeden/wohnkork/corkstone/#jfmulticontent_c692-3" rel="">Technische Daten</a></li>
		
	</ul>
	
	<div  id="jfmulticontent_c692-1">
		<div id="c693" class="csc-default"><div class="tx-rgsmoothgallery-pi1 rgsgnest693">
    		<script type="text/javascript">
    			function startGallery693() {
    			  if(window.gallery693)
    			    {
    			    try
    			      {
    				    var myGallery693 = new gallery($('myGallery693'), {
    					    timed:false,
    					      showArrows: true,
                  showCarousel: true,
                  textShowCarousel: 'Thumbnails',
                  embedLinks:true,
                  thumbHeight:40,thumbWidth:60,thumbOpacity: 0.7,useExternalCarousel:true,carouselElement:$("externalthumbs"),
    					    lightbox:true
    				    });
    				    var mylightbox = new LightboxSmoothgallery();
    				    }catch(error){
    				    window.setTimeout("startGallery693();",2500);
    				    }
    				  }else{
    				  window.gallery693=true;
    				  if(this.ie)
    				    {
    				    window.setTimeout("startGallery693();",3000);
    				    }else{
    				    window.setTimeout("startGallery693();",100);
    				    }
    				  }
    			}
    			window.onDomReady(startGallery693);
    		</script><noscript>
    		<div class="rgsgcontent"><div class="myGallery-NoScript" id="myGallery-NoScript693"><div class="rgsg-btn" style="display:none">00</div><img src="typo3temp/pics/d8143654e1.jpg" class="full" /></div></div>
    		</noscript><div class="rgsgcontent"><div class="myGallery" id="myGallery693"><div class="rgsg-btn" style="display:none">00</div>
      <div class="imageElement"><h3>Basalt</h3><a href="typo3temp/pics/bb098dd1eb.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/d8143654e1.jpg" class="full" />
        <img src="typo3temp/pics/16f9c3bedb.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Fossil</h3><a href="typo3temp/pics/7b8892ddf1.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/5edbc41e9c.jpg" class="full" />
        <img src="typo3temp/pics/1c5d44c0a4.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Granit Garda</h3><a href="typo3temp/pics/696b57af4e.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/23c72d8013.jpg" class="full" />
        <img src="typo3temp/pics/97468d4959.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Marinaro</h3><a href="typo3temp/pics/a52ce4b8a7.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/a6e1318233.jpg" class="full" />
        <img src="typo3temp/pics/80cb5080d1.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Oxydstein</h3><a href="typo3temp/pics/23546c3071.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/5564dd3d7c.jpg" class="full" />
        <img src="typo3temp/pics/f065dcfdda.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Saldurstein</h3><a href="typo3temp/pics/89f4056212.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/e6eae94830.jpg" class="full" />
        <img src="typo3temp/pics/36a7d899d6.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Schiefer Rio Negro</h3><a href="typo3temp/pics/99321859fd.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/08d32ccb25.jpg" class="full" />
        <img src="typo3temp/pics/c06051a882.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Schiefer Sahara</h3><a href="typo3temp/pics/aa20cf7a09.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/da10271d71.jpg" class="full" />
        <img src="typo3temp/pics/ade485147c.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Schiefer Sardo</h3><a href="typo3temp/pics/49ca0df12e.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/43e2c4243e.jpg" class="full" />
        <img src="typo3temp/pics/844942cb76.jpg" class="thumbnail" />
      </div>
      <div class="imageElement"><h3>Terrazo</h3><a href="typo3temp/pics/51914cda7f.jpg" title="Bild vergrößern" class="open"></a>
        <img src="typo3temp/pics/5bfc2d9241.jpg" class="full" />
        <img src="typo3temp/pics/e19b23a470.jpg" class="thumbnail" />
      </div></div></div></div><div id="externalthumbs"></div></div>
	</div>

Da es sich hier um eine TYPO3 Extension handelt habe ich nicht die geringste Ahnung, wo ich den Code eintragen soll, also in welchem CSS Block. Oder wäre es besser einen divContainer zu setzen, der das Clear:both enthält?
 
Oder wäre es besser einen divContainer zu setzen, der das Clear:both enthält?
Zum Vergrößern anklicken....

Genau. Du brauchst ein weiteres Element, dass innerhalb von dem Div mit den Rahmen (schätzungsweise #jfmulticontent_c692-1) die Floats beendet.

Probier das mal an dieser Stelle

HTML: 
    </div></div></div></div><div id="externalthumbs"></div></div>
  </div>
</body>

einfzufügen.

HTML: 
    </div></div></div></div><div id="externalthumbs"></div></div>

  <div style="clear: both;"></div>

  </div>
</body>
 
Das heist, ich muss die Extension zerlegen. Dann gute Nacht.

SCH***** Typo3, bei Joomla geht das einfacher...

Danke für die Hilfe, ich werds versuchen.
 
Ich kenn mich mit TYPO3 nicht aus, aber ich kann mir nicht recht vorstellen, dass dafür solch (signifikant) fehlerhafte Extensions angeboten werden. Bist du sicher, dass die richtig an's System angehakt ist?
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück