CSS Bilder-Mosaik

Dieses Thema im Forum "Web Page Design" wurde erstellt von orgonaut, 03.03.2006.

  1. orgonaut

    orgonaut Thread Starter MacUser Mitglied

    Beiträge:
    10.240
    Zustimmungen:
    768
    MacUser seit:
    09.08.2004
    Edit: Die Bilder bilden (jetzt) ohne Abstand ein 3x3-Quadrat.

    Hier mein CSS-Code:
    Code:
    /* IE (CSS-Weiche) */ 
    
    * html ul { float:left; }
    * html ul li { clear:left; }
    
    /* IE Ende */
    
    ul {
    	margin: 0px;
    	padding: 0px;
    	line-height: 0px;
    	clear: left;
    }
    
    li {
    	list-style-type: none;
    	display: inline;
    	margin: 0px;
    	padding: 0px;
    	float: left;
    }
    
    div {
    	width: 160px;
    	background-color: #CCCCCC;
    	border: 1px solid #999999;
    	padding: 0px;
    	margin: 0px;
    	height: 160px;
    	}
    HTML:
    <div>
    <ul>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
    </ul>
    <ul>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
    </ul>
    <ul>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
      <li><img src="favicon.gif" width="16" height="16" alt="Bild1" /></li>
    </ul>
    </div>

    Erfolgreich getestet habe ich es jetzt am Mac in Mozilla Firefox, Safari und Opera. (Der Mac-IE zickt (nicht mehr!!) rum!!)

    Falls das jemand nachmachen möchte, klappt super! Tabellen ade! :D
    Fehler bitte posten!
     
    Zuletzt bearbeitet: 04.03.2006

Diese Seite empfehlen