Beiträge von doPdesign

doPdesign

CSS der Tabelle

CSS

div#tabelle		{	
					width: 950px;
					height: 350px;
					margin-left:110px;
					float: left;
					overflow: auto;
				}




.tabelle		{
					width: 900px;
					border: 1px solid #4dd57c;
					border-spacing: 0;				
					padding: 0;
				}




.tabelle caption	{
					background-color: #333;
					font-size: 14px;
					font-weight: bold;
					color: #b4cbbc;
					padding: 6px 0 3px 0;
				}







.th1			{
					background-color: #333;
					border: 1px solid #4dd57c;
					text-align: center;
					font-size: 14px;
					color: #b4cbbc;
					font-weight: bold;
				}













.td1			{
					font-size: 12px;
					color: #b4cbbc;
					padding: 5px 5px;
					background-color: #333;
					border: 1px solid #4dd57c;
					text-align: center;
				}

Alles anzeigen

HTML der Tabelle:

HTML

<div id="tabelle">
			<table class="tabelle"> 
			<caption><u>Warme Getr&auml;nke</u></caption> 	




			<thead> 
			<tr> 
			<th class="th1">Getr&auml;nk</th>
			<th class="th1">Menge</th>
			<th class="th1">Preis</th>
			<th class="th1">Bearbeiten</th>
			<th class="th1">L&ouml;schen</th>
			</tr>
			</thead> 

			<tbody> 
			<tr>
			<td class="td1">Kaffee</td>
			<td class="td1">1,0l</td>
			<td class="td1">1,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Tee</td>
			<td class="td1">1,0l</td>
			<td class="td1">1,49&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Heisse Schokolade</td>
			<td class="td1">0,5l</td>
			<td class="td1">0,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			</tbody> 
			</table> 

			<table class="tabelle"> 




			<caption><u>Kalte Getr&auml;nke</u></caption> 




			<thead> 
			<tr> 
			<th class="th1">Getr&auml;nk</th>
			<th class="th1">Menge</th>
			<th class="th1">Preis</th>
			<th class="th1">Bearbeiten</th>
			<th class="th1">L&ouml;schen</th>
			</tr>
			</thead> 

			<tbody> 
			<tr>
			<td class="td1">Mineralwasser</td>
			<td class="td1">0,7l</td>
			<td class="td1">0,49&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Cola</td>
			<td class="td1">1,0l</td>
			<td class="td1">1,19&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Fanta</td>
			<td class="td1">1,0l</td>
			<td class="td1">0,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Sprite</td>
			<td class="td1">1,0l</td>
			<td class="td1">0,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Softdrink Mix</td>
			<td class="td1">12x1,0l</td>
			<td class="td1">12,49&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Apfelschorle</td>
			<td class="td1">0,7l</td>
			<td class="td1">0,89&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">O-Saft</td>
			<td class="td1">0,75l</td>
			<td class="td1">0,79&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			</tbody> 
			</table> 

				<table class="tabelle"> 




			<caption><u>Alkoholische Getr&auml;nke</u></caption> 




			<thead> 
			<tr> 
			<th class="th1">Getr&auml;nk</th>
			<th class="th1">Menge</th>
			<th class="th1">Preis</th>
			<th class="th1">Bearbeiten</th>
			<th class="th1">L&ouml;schen</th>
			</tr>
			</thead>

			<tbody> 
			<tr>
			<td class="td1">Bier</td>
			<td class="td1">50,0l</td>
			<td class="td1">105,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Bier</td>
			<td class="td1">30,0l</td>
			<td class="td1">53,59&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Rotwein</td>
			<td class="td1">0,7l</td>
			<td class="td1">3,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Weisswein</td>
			<td class="td1">0,7l</td>
			<td class="td1">2,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Sekt</td>
			<td class="td1">0,75l</td>
			<td class="td1">3,79&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Kr&auml;terlik&ouml;r</td>
			<td class="td1">0,7l</td>
			<td class="td1">8,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			<tr>
			<td class="td1">Cognac</td>
			<td class="td1">0,7l</td>
			<td class="td1">14,99&euro;</td>
			<td class="td1"><a href="#"><img src="images/bear.png" width="16" height="16" alt="bear" /></a></td>
			<td class="td1"><a href="#"><img src="images/muell.png" width="16" height="16" alt="muell" /></a></td>
			</tr>

			</tbody>
			</table>

Alles anzeigen

doPdesign

Hallo ich habe ein Problem und zwar habe ich eine Tabelle in css mit dem code overflow: auto; formatiert. Funktioniert soweit auch alles, aber in Firefox bleibt immer der letzte sichtbare text der Tabelle stehen beim scrollen nach unten und oben. Aktualliesiert man den Browser verschwindet es aber läd man die Seite wieder neu und will nach unten srollen bleibt wieder text hängen. Im IE passiert dies nicht.

Im anhang ein bild des fehlers

Beiträge von doPdesign

overflow: auto; Problem in Firefox 26.0

overflow: auto; Problem in Firefox 26.0