Tabelle mit CSS



  • Hab eine Tabelle mit CSS gebastelt nur stimmt im Header die Ausrichtung nicht?!?
    Hier der CSS Code:

    #tbody {
    	height:400px;
    	overflow-y:auto;
    	width:600px;
    	top: 240px;
             left: 270px;
    	position: absolute;
    }
    table {
    	border-collapse:collapse;
    }
    td {
    	padding:1px 5px;
    	float:middle;
    }  
    .td1 {
    	width:150px;
    }
    .td2 {
    	width:150px;
    }
    .td3 {
    	width:150px
    }
     .td4 {
    	width:150px
    }
    
    #header {
    	width:600px;
    	background:DodgerBlue;
    	top: 210px;
    	left: 270px;
    	position:absolute;
    }
    
    #header div {
    	padding:1px 5px;
    	float:left;
    	border-right:1px solid black;
    }
    
    #header #head1 {
      	width: 150px;
    }
    #header #head2 {
    	width:150px;
    }
    
    #header #head3 {
    	width:150;
    }
    
    #header #head4 {
    	width:150;
    }
    

    Hier der entsprechende HTML Code

    echo "<div id=\"header\">
            <div id=\"head1\" align=\"middle\"><strong>First</strong></div>
            <div id=\"head2\" align=\"middle\"><strong>Second</strong></div>
            <div id=\"head3\" align=\"middle\"><strong>Third</strong></div>
            <div id=\"head4\" align=\"middle\"><strong>Fourth</strong></div>
            </div>
            <div id=\"tbody\">
            <table>";
    
    echo "<tr>
            <td class=\"td1\">1</td>		
            <td class=\"td2\">1</td>
            <td class=\"td3\">1</td>
            <td class=\"td4\">1</td>
         </tr>
         </table>";
    


  • Für eine Tabelle nimmt man normalerweise eine Tabelle ...



  • Dafuer wirds doch wohl auch ne Loesung geben?



  • http://de.selfhtml.org/css/eigenschaften/positionierung.htm#display
    Besonderes Augenmerk ist auf die Werte zu legen, die mit "table-..." beginnen.



  • Hab eine Tabelle mit CSS gebastelt nur stimmt im Header die Ausrichtung nicht?!?

    Aha! Sehr interessant



  • Hab Sie mit CSS gemacht da die Tabelle bei einem Overflow scrollable sein soll! Gibs fuer meinen vorhandenen Code nicht eine einfache Loesung?



  • Ja, eine Tabelle anstelle des div-headers

    <table>
       <tr>
         <th>bla...</th>
         <!-- .... -->
       </tr>
    </table>
    <div id='tbody'>
    <table>
    <!-- usw. -->
    

    LG


Anmelden zum Antworten