HTML-skola Alternativ

[anna_rispan]

jag har hittat en sida på nätet som är bra för jag förstår det mesta. nu har jag lagt in en tabell i min blogg. det fula är att den hamnar så långt ner! och jag hittar inga enterslag eller nåt så varför hamnar den så långt ner i arket eller rutan....

nån som vet eller tror sig veta? ni får skicka pm om ni tycker det blir trassligt att förklara här. eller så ses vi i chatten vid tillfälle.

redigerat stavfel

Redigerat av anna_rispan: 06-10-2007, 14:36

[sanakan]

För att slippa tabellen helt och hållet och ändå kunna sätta bilder och bildtext där du vill kan du prova detta istället:

Allting du skriver inom "div" här nere lägger sig på den plats du har specificerat med koden efter "div style"

float:left betyder att hela "klumpen" med bild+bildtext sätter sig på vänster sida, och din vanliga blog-text kommer då gå förbi denna klump med bild+bildtext på höger sida. Detta kan du enkelt ändra till float:right istället. Ändra värdena till det du vill ha! Prova dig fram:

<div style="float:left; width: 150px; margin-right: 15px; margin-bottom: 15px;">
<img src="dinbild.jpg">
<p>Din bildtext</p>
</div>

Enklare, tror jag. Tabeller är inte tänkt primärt för bilder+text utan för datapresentation.

Men om du nu ändå vill ha tabell (prova det jag nämnde först, först!): Vad exakt är det du vill göra med tabellen?
Du vill kunna placera ett foto var du vill och sen text var du vill bredvid eller under fotot? Är det innehållet i tabellen, eller HELA tabellen, som kommer långt ner?

Till att börja med: skriv tabell-koden precis i början av den ruta där du skriver in koden, tryck inga "enter"/nya rader alls efter den text du skrivit innan. Kommer den högre upp då?

Det är bra att medan man arbetar med tabellen låta tabellens linjer vara synliga, för först då vet man ju om HELA tabellen åkt ner, eller om det bara är innehållet som presenteras långt ner -I- själva tabellen... För att se tabellens linjer skriver man i taggarna för tabellen så här, sen ändrar man bara värdet till 0 när man är nöjd.

<table border="1">
<tr>
<td>text</td>
</tr>
</table>

Förklaring:
<tr> betyder ju ny tabellrad, där kan man infoga hur många celler man vill på varje rad. dvs, skriva <td>Text 1</td><td>Text 2, eller en bild genom bildkod</td>, osv.
</tr> slut på rad.

Du kan också positionera ut tabellen var du vill genom att skriva detta i tabellens kod, men då ändra antalet pixlar till det du vill:

<table style="position:absolute; top:10px; left:15px">
<tr>
<td>Text</td>
</tr>
</table>


Sen kan det vara bra att veta koderna cellspacing och cellpadding.
Cellspacing= det antal pixlar du vill ska vara mellan själva cellerna i hela tabellen. Utfyllnadsplats alltså.
Cellpadding= det antal pixlar du vill ska vara mellan cellens kant och texten eller bilden som är inne i cellen (en sorts marginal alltså). Till exempel:

<table cellspacing="30" cellpadding="10">
<tr>
<td>Text</td>
</tr>
</table>

Och till sist, det är bra att veta att inuti själva cellen, där du kanske har en text eller en bild, kan man välja om innehållet ska vara centrerat mot topp/botten, höger/vänster, genom att skriva till detta i cellkoden. valign betyder vertikal position och align höger-vänster-position:

<td valign="top" align=left">

Redigerat av sanakan: 08-10-2007, 11:54