display: table; [nieuwe vraag gesteld! Lees nieuwe reactie van mij]
Graag zou ik hulp krijgen op het volgende punt:
Sinds vandaag ben ik begonnen met het gebruik van CSStabels aangezien de <tr></td></td></tr> niet aan te raden is. Nu loop ik echter tegen een probleem op:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<style>
.table{
display: table;
}
</style>
<label>hoi</label><input type="text" name="text" class="table" /></div>
.table{
display: table;
}
</style>
<label>hoi</label><input type="text" name="text" class="table" /></div>
Zoals jullie zien heb ik een label rond 'hoi' gezet, de bedoeling is dat dat aan de linkerkant van de textfield komt te staan:
| Naam: |Textfield| |
Is daar een eventuele oplossing voor? Graag zou ik weten welke!
Kijk eens naar dit topic: http://www.phphulp.nl/php/forum/topic/nette-form/84104/ Daarin worden een aantal slechte, maar ook een aantal goede voorbeelden gegeven.
Ik ben uitgekomen op jouw voorbeeld en zal die ook gaan gebruiken.
Nogmaals dank!
Toevoeging op 17/04/2012 16:41:40:
Ben ik weer, heb nu een vraag betreffende de, voor mij nieuwe methode.
Ik heb nu een css code:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
form
{
padding: 10px;
margin-left: 25%;
}
label
{
width: 150px;
display: inline-block;
padding-right: 15px; /* Afstand tussen Labels en Textfields*/
}
label, input
{
margin: 2px 0;
}
{
padding: 10px;
margin-left: 25%;
}
label
{
width: 150px;
display: inline-block;
padding-right: 15px; /* Afstand tussen Labels en Textfields*/
}
label, input
{
margin: 2px 0;
}
In mijn HTML heb ik:
Code (php)
1
<label for='bio'>Bio:</label><textarea></textarea><br>
Wat ik nu wil is dat de tekst 'Bio' aan de bovenkant, naast de tekstarea is uitgelijnt. Net als de textfiels, zeg maar!
Hoe doe ik dat?
Sorry voor het late antwoord - ik lees je vraag nu pas.
Dat je geen html-tables mag gebruiken is volstrekste onzin. Je moet weten waarvóór je ze gebruikt. Als je data wilt tonen, gebruik je hiervoor gewoon een html table. Daarvoor is deze ontwikkeld, en is daarvoor uitermate geschikt. Sterker: het is de enige (juiste) manier om die te tonen!
Een html table mag niet gebruikt worden voor iets anders, zoals pagina opmaak. Een pagina maak je op met de CSS display:table property (als dit je voorkeur heeft).
In jouw geval heb je data. Je moet dus een html table gebruiken.
Css kun je makkelijk gebruiken hiervoor, en hij heeft hier geen 'data' maar een formulier.
Ik zie data als mysql queries die je wilt afdrukken op je pagina, of dit nu met een while loop, foreach loop of gewoon 1 woord is.
Met css ben je velenmalen flexiebeler en veel meer styling mogelijkheden dan met tables. En je moet niets, het kan met tables maar voor 'afwijkende opmaak' zou ik voor css gaan en geen tables gebruiken.
John, data voor tabellen is resultaten van bijv. een onderzoek. Of een overzicht van alle gebruikers. Data is niet een formulier of de content van een website.
Ben het met je eens dat je ook css tables kunt gebruiken in dit geval. Ik ben het ook met je eens dat je niets MOET - verkeerde woordkeuze mijnerzijds. Uit de oorspronkelijke vraag begreep ik dat Cailin html tables had, die hij wilde omzetten naar css-tables, omdat een html table "niet aan te raden is".
Hoewel je semantisch gelijk hebt dat het niet om data gaat maar een formulier, lijkt mij het gebruik van een html table toch eenvoudiger dan een css table. Maar goed, dat mag hij zelf natuurlijk beslissen.
Overigens ben ik het niet met je eens dat data alleen iets is dat je met sql (of een andere database) genereert: je kunt net zo goed statische gegevens in een html pagina opnemen.
Wat bedoel je met css-table en HTML-table? Een table is een table en altijd HTML. Wat je in css doet is de HTML-table stylen, maar het blijft ten alle tijden een HTML-table.
Als je met css gaat werken gebruik je div's en geen tables, dat is het grote verschil tussen deze twee en geeft je veel meer vrijheid dan met tables.
Het database gedeelte was een voorbeeld, maar de opmaak van een formulier is geen data maar HTML. De gegevens van de $_POST op de volgende pagina is data, om eventjes een ander voorbeeld dan een database te geven.
@Wouter,
Klopt ik zag het, ik heb gereageerd op het bericht van John, aangezien die van vandaag was.
Gewijzigd op 20/07/2012 14:29:04 door Chris PHP
Quote:
Als je met css gaat werken gebruik je div's en geen tables, dat is het grote verschil tussen deze twee en geeft je veel meer vrijheid dan met tables.
Phoei daar zeg je wat verkeerds. CSS en divisions zijn 2 totaal andere dingen. Een table maak je ook op met CSS en een division hoef je niet per se te linken aan CSS.
CSS en HTML zijn 2 totaal en ook echt totaal andere dingen. HTML moet je schrijven om elke tekst semantisch zo goed mogelijk weer te geven, niet omdat het makkelijk te stijlen is, daar heb je CSS voor.
En dat is de fout die John hier maakt. John heeft het erover dat je HTML tabellen maar gewoon moet gebruiken omdat het makkelijker is om te stijlen dan display: table; in CSS te gebruiken. Goed, het is inderdaad makkelijker, maar dat je daarom maar HTML tabellen moet gebruiken. Nee!! John geeft zelf het antwoord al:
"Hoewel je semantisch gelijk hebt dat het niet om data gaat maar een formulier"
Het enige nut van HTML in de wereld van de www's is het semantisch weergeven. Ga dus nooit het semantisch weergeven ondergeschikt stellen aan het makkelijk stijlen. Soms heb je een extra division nodig om het te stijlen, dat is prima. Maar ga niet verkeerde elementen gebruiken omdat 'het makkelijker is en ach die semantiek maak toch niks uit'.
Misschien was ik iets te kort door de bocht, maar mijn punt was eigenlijk dat je velen malen flexibeler bent met div's dan met een table. En ja div's staan uiteraard los van CSS, echter maak je de opmaakt in CSS mijn fout dus omdat ik wat te kort door de bocht ging.
Een table kun je nog in-line een border geven, met div's moet je style="" gebruiken wat dus CSS is. Zonder dat heb je weinig aan een div, terwijl een table ook zonder CSS opgemaakt kan worden.
Had verwacht om niet een post van twee a4'tjes te hoeven maken ;-)
Gewijzigd op 20/07/2012 14:38:59 door Chris PHP