Just nu i M3-nätverket
Jump to content

table align i xhtml strict


Henrik Hallin

Recommended Posts

Henrik Hallin

<table align="center"> får man inte skriva i strict xhtml när man vill centrera hela tabellen på sidan. Ska istället vara i stilmallen. Men frågan är hur?

Link to comment
Share on other sites

<table style="align:center;">

den finns inte...

 

prova

<table class="center">

 

Eller den här...

 

<div style="width: 100%; height:100%; text-align: center;">

<table style="margin: 0px auto;">

<tr>

<td>this is a test</td>

</tr>

</table>

</div>

 

[inlägget ändrat 2002-04-13 13:36:33 av NordicOne]

Link to comment
Share on other sites

Henrik Hallin

Provade detta förut, men det funkade inte. Fast då provade jag bara i Mozilla. Nu när jag provade igen, och då i Explorer så funkar det där. Det kanske är en bugg i Mozilla, eller så ska inte div med text-align kunna positionera tabeller.

<table class="center"> har i sig inga centreringsegenskaper.

 

 

 

 

Link to comment
Share on other sites

Glöm <table class="center"> det centrerar bara texten - kom ihåg att du måste behärska class i CSS där - jag skippar över det.

 

Prova det här istället:

Lägg till nedanstående i stilmallen

 

.centered-table {

margin-left: auto;

margin-right: auto;

}

 

dvs lägger auto-matiskt till lika stor marginal på bägge sidor om tabellen.

 

EX:

<div class="centered">

<h3>Centrerings test</h3>

<p>

Tabell över städer

</p>

<table class="centered-table" border="1">

<tr><td>Stockholm</td> <td>Köpenhamn</td></tr>

<tr><td>Oslo</td><td>Reykjavik</td></tr>

</table>

</div>

 

Funkar i senaste Mozilla, Opera och IE!

 

Eller skippa tabellen och använda positionering (CSS2) med tex <div> som hållare ;-)

 

 

[inlägget ändrat 2002-04-14 00:55:11 av NordicOne]

Link to comment
Share on other sites

Henrik Hallin

Fick av någon anledning inte det att funka heller, men har äntligen hittat en annan lösning som verkar vara en kombination av det man testat tidigare!

 

<div style="width: 100%; text-align: center;">

<table style="margin: 0px auto;">

<tr><td>Hå och Hej</td></tr>

</table>

</div>

 

Skam den som viker sig för strict. ;o)

 

 

 

 

Link to comment
Share on other sites

Jag ger dig hela koden - eftersom du inte fick det att funka ;-)

 

<html>

 

<head>

 

<style type="text/css">

<!--

.centered { text-align: center; }

.centered-table {

margin-left: auto;

margin-right: auto;

}

-->

</style>

 

<title>Centrerings test av tabeller</title>

 

</head>

 

<body>

 

<div class="centered">

<h3>Centrerings test</h3>

<p>

Tabell över städer

</p>

<table class="centered-table" border="1">

<tr><td>Stockholm</td> <td>Köpenhamn</td></tr>

<tr><td>Oslo</td><td>Reykjavik</td></tr>

</table>

</div>

</body>

 

</html>

 

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...