[Html] Tabel wil niet - Softwareontwikkeling

vrijdag 21 maart 2003 21:37

Acties:

Verwijderd

Topicstarter

Ik ben een forum aan het maken in php maar de layout van de messages wil niet echt.

Dit is mijn code:

code:

<Table Border="1" Width="70%" CellSpacing=".2" CellPadding="2">
       <Tr><Td ColSpan="2" width="100%" Align="Center"><B>$TopicTitel</B></Td></Tr>
       <Tr><Td ColSpan="2" width="100%" Align="Left"><A Href="Messageboard.php?Action=ViewAllTopics&Sort=ByDateDESC"><</A></Td></Tr>

       <Tr><Td Width="50%"><I>$Data[Date]</I></Td><Td Width="50%">$Data[Edit]</Td></Tr>
       <Tr><Td Width="10%" VAlign="top"><B>$Data[Poster]</B></Td><Td Height="100" Width="90%">$Data[Message]</Td></Tr>

       <Tr><Td ColSpan="2" width="100%" Height="5"></Td></Tr>
       <Tr><Td Align="Right" ColSpan="2" width="100%" Height="10"><A Href="Messageboard.php?Action=NewMessage&ID=$TopicID">Post Message</A></Td></Tr>
       </Table>

(Het gaat eigenlijk om het stukje tussen de 2 witregels)

Dit is wat ik (ongeveer) wil krijgen:
Afbeeldingslocatie: http://ra2modding.virtualave.net/tabel.jpg

Afbeeldingslocatie: http://ra2modding.virtualave.net/tabel.jpg

Maar met deze code krijg ik dat de 2e rij ook 50-50 verdeeld word (zoals de 1e)

wat zie ik hier over het hoofd ?

vrijdag 21 maart 2003 21:41

Acties:

Zpottr

Henk

Verwijderd schreef op 21 March 2003 @ 21:37:
wat zie ik hier over het hoofd ?

Dat boven elkaar liggende cellen dezelfde breedte krijgen? Oftewel, voor jouw schetsje heb je minimaal 3 kolommen nodig, waarvan je er soms 3 of 2 samenvoegt om een bredere cel te krijgen.

code:

|                        colspan=3                              |
----------------------------------------------------------------
|          colspan=2            |           colspan=1           |
----------------------------------------------------------------
|  colspan=1  |                 colspan=2                       |
----------------------------------------------------------------
|                        colspan=3                              |

[ Voor 47% gewijzigd door Zpottr op 21-03-2003 21:48 . Reden: Xtreem brakke ASCII-skillz geshowed ]

Zoef

vrijdag 21 maart 2003 21:46

Acties:

Sybr_E-N

Dit bedoel je zeker?:

code:

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr> 
    <td colspan="2">&nbsp;
    <td width="52%">&nbsp;
  <tr> 
    <td width="14%">&nbsp;
    <td colspan="2">&nbsp;
</table>

vrijdag 21 maart 2003 22:10

Acties:

supakeen

Verwijderd schreef op 21 maart 2003 @ 22:09:
Is er nu nog een makkelijke manier om de tableborder tussen de bovenste (die dus 50-50 verdeeld is) te laten verdwijnen? (of is dat onmogelijk?)

De wondere wereld van de css

vrijdag 21 maart 2003 22:13

Acties:

Verwijderd

Topicstarter

zmn schreef op 21 maart 2003 @ 22:10:
[...]

De wondere wereld van de css

ja, maar daar kun je toch alleen de randen (links rechts boven onder enzo) definieren voor een hele tabel? of kan dat ook voor een cell?

edit: heb het dus gevonden

css:

code:

1 2	TD.NoBorderRight {Border-right-width:0} TD.NoBorderLeft {Border-left-width:0}

jullie zijn gweldig

edit2:
voor de geinteresseerden nog eventjes de html-code:

code:

<Html>
<Head>
<LINK HREF="Stylesheet.css" TYPE="text/css" REL="stylesheet">
</Head>
<Center><table Border="1" Width="70%" CellSpacing=".2" CellPadding="2">
  <Tr>
    <Td Colspan="3" Align="Center">TopicTitel</Td>
  </Tr>
  <Tr> 
    <Td Class="NoBorderRight" Colspan="2" Align="Left">Date Posted</Td>
    <Td Class="NoBorderLeft" width="50%" Align="Right">Edit Message</Td>
  <Tr Height="100"> 
    <Td width="10%" Valign="Top" Align="Left">Poster</Td>
    <Td Colspan="2" Valign="Middle" Align="Left">Message</Td>
  </Tr>
  <Tr>
    <Td Class="NoBorderRight" Colspan="2" Align="Left">Back to TopicOverzicht</Td>
    <Td Class="NoBorderLeft" width="50%" Align="Right">Post New Message</Td>
  </Tr>
</table>
</Center>
</Html>

[ Voor 72% gewijzigd door Verwijderd op 21-03-2003 22:21 ]

vrijdag 21 maart 2003 22:17

Acties:

WebRaider

There's Always a way

Probeer eens te werken met een WYSIWYG-editor, werkt stukken makkelijker.
De beste vind ik persoonlijk Dreamweaver MX.
Try it!

WebRaider

vrijdag 21 maart 2003 22:21

Acties:

Sybr_E-N

Hier staan de CSS specificaties: http://www.w3.org/TR/REC-CSS2/
Daar staat alles wat je moet weten.
Ben nou toch bezig. Zie hier voor alle HTML specs http://www.w3.org/TR/html401/

vrijdag 21 maart 2003 22:21

Acties:

Verwijderd

Topicstarter

WebRaider schreef op 21 March 2003 @ 22:17:
Probeer eens te werken met een WYSIWYG-editor, werkt stukken makkelijker.
De beste vind ik persoonlijk Dreamweaver MX.
Try it!

ja maar dan leer je er ook niets van he

vrijdag 21 maart 2003 22:35

Acties:

Dark Blue

Compositionista!

Alpenmeisje

Verwijderd schreef op 21 March 2003 @ 22:21:
[...]

ja maar dan leer je er ook niets van he

$_/-\o_$

heidiulrich.nl | adventura.nl : rugzakavonturen | pathwise.nl : prepping geeks to get jobs

vrijdag 21 maart 2003 22:53

Acties:

shades

huh ?

Volgens mij, ik ben ook al een tijdje bezig geweest met lay-out in tabellen te maken, moet er een vette faq komen over het maken van een lay-out met css. Een aantal links naar sites die goede uitleg geven is waarschijnlijk al voldoende.

Ik heb hier een lijste die got'ers ook aan mij gegeven hebben en waar ik goed mee uit de voeten kon:
Link op het internet:
http://www.w3schools.com/css/css_positioning.asp Deze is handig voor de syntax
http://www.w3schools.com/css/default.asp
http://glish.com/css/ Deze is echt handig en heeft voorbeeld layouts
http://www.w3.org/Style/CSS/

Verder heb ik in 1 dag mij tabel lay-out omgezet naar div's het rechts uitlijnen is het lastigst. Wellicht het bekijken waard. De div versie is niet perfect maar geeft wel een duidelijk beeld wat het met je code doet t.o.v. tabellen..
lay-out met tabellen
lay-out met divs

Voordeel van divs is dat je code duidelijkere en korter wordt. Je moet wel een css bestandje maken of de styles in je code opnemen voor de positionering van alles. Een nadeel vind ik is dat je de lay-out niet echt in de hand hebt met het resizen van de browser. Met de tabel had ik dat wel maar dat kan ook aan mij liggen. Ben pas 1 dag met div-layout aan het stoeien.

Edit:
Wat mij verder opviel is dat de divs via een ID="iets" (in de stylesheet wordt dat '#iets') geregeld worden en niet via een CLASS="iets" (in de stylesheet wordt dat '.iets'). Geen idee waarom.

[ Voor 11% gewijzigd door shades op 21-03-2003 22:58 ]

https://k1600gt.nl

vrijdag 21 maart 2003 23:13

Acties:

supakeen

shades schreef op 21 maart 2003 @ 22:53:
Volgens mij, ik ben ook al een tijdje bezig geweest met lay-out in tabellen te maken, moet er een vette faq komen over het maken van een lay-out met css. Een aantal links naar sites die goede uitleg geven is waarschijnlijk al voldoende.

Ik heb hier een lijste die got'ers ook aan mij gegeven hebben en waar ik goed mee uit de voeten kon:
Link op het internet:
http://www.w3schools.com/css/css_positioning.asp Deze is handig voor de syntax
http://www.w3schools.com/css/default.asp
http://glish.com/css/ Deze is echt handig en heeft voorbeeld layouts
http://www.w3.org/Style/CSS/

Verder heb ik in 1 dag mij tabel lay-out omgezet naar div's het rechts uitlijnen is het lastigst. Wellicht het bekijken waard. De div versie is niet perfect maar geeft wel een duidelijk beeld wat het met je code doet t.o.v. tabellen..
lay-out met tabellen
lay-out met divs

Voordeel van divs is dat je code duidelijkere en korter wordt. Je moet wel een css bestandje maken of de styles in je code opnemen voor de positionering van alles. Een nadeel vind ik is dat je de lay-out niet echt in de hand hebt met het resizen van de browser. Met de tabel had ik dat wel maar dat kan ook aan mij liggen. Ben pas 1 dag met div-layout aan het stoeien.

Edit:
Wat mij verder opviel is dat de divs via een ID="iets" (in de stylesheet wordt dat '#iets') geregeld worden en niet via een CLASS="iets" (in de stylesheet wordt dat '.iets'). Geen idee waarom.

ID kun je ook met getElementByID aanspreken

zaterdag 22 maart 2003 00:25

Acties:

shades

huh ?

zmn schreef op 21 March 2003 @ 23:13:
[...]

ID kun je ook met getElementByID aanspreken

Zodat je via jscript de zaak kan veranderen.. das een goeie.

https://k1600gt.nl