Denna delen av 99 uppdateras inte längre utan har arkiverats inför framtiden som ett museum.
Här kan du läsa mer om varför.
Mac-nyheter hittar du på Macradion.com och forumet hittar du via Applebubblan.

Problem med höjden på tabeller i Safari

Tråden skapades och har fått 15 svar. Det senaste inlägget skrevs .
1
Skriv svar
#1
  • Oregistrerad ●
  • 2005-03-02 17:06

Jag har ett stort problem!
Jag skall göra en sida som består av en tabell vidd och höjd 100% och trerader. Längst upp och längst ner skall det vara celler med bakgrund. Fälten upptill och nertill skall vara lika höga och mitten ha fixt storlek. De två fälten uppe och ner blir inte lika stora i Safari, vad göra?

<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td bgcolor="#CCCCCC"> </td>
</tr>
<tr>
<td height="300"> </td>
</tr>
<tr>
<td bgcolor="#CCCCCC"> </td>
</tr>
</table>

Det blir lika höga om jag sätter höjden till pixlar istället för procent... Men jag vill ju att mitten skall ha bestämd höjd... Kan nån hjälpa mig?

Senast redigerat 2005-03-03 02:23
Anmäl Ändra Svara
#2

Mitt tips är att du använder CSS: http://www.thenoodleincident.com/tutorials/box_lesson/basic_centered.html

Anmäl Ändra Svara
#3
  • Medlem ●
  • Karlstad
  • 2005-03-02 19:42

100% höjd på en tabell har aldrig varit godkänd kod. W3C har i sin outgrundliga visdom bestämt att man inte får göra så.

Men det går ändå. Om du tar bort DTD (den allra översta kodraden som definerar doctypen) så funkar det. Men då anses sidan inte vara korrekt av en del folk.

Eller så kan du kolla här: http://apptools.com/examples/tableheight.php

I ditt fall (och om jag fattar rätt) så måste du göra mittencellerna med fast höjd och den översta och nedersta cellen i procent. Jag tror du kan dra till med vilkne siffra som helst. Hela tabellen gör du 100%.

Men....om innehållet i mittencellerna expanderar när t.ex. en användare ökar fontstorleken, så kommer cellen att expandera också.

Anmäl Ändra Svara
#4
Ursprungligen av Danne V:

Om du tar bort DTD (den allra översta kodraden som definerar doctypen) så funkar det. Men då anses sidan inte vara korrekt av en del folk.

Inte bara av en del folk och av W3C. De flesta webbläsare hanterar (X)HTML och CSS olika beroende på om en DOCTYPE finns eller inte, och beroende på vilken DOCTYPE som anges.

Anmäl Ändra Svara
#5
  • Medlem ●
  • Karlstad
  • 2005-03-03 07:33
Ursprungligen av system.log:

Inte bara av en del folk och av W3C. De flesta webbläsare hanterar (X)HTML och CSS olika beroende på om en DOCTYPE finns eller inte, och beroende på vilken DOCTYPE som anges.

Jorå, jag förenklade svaret eftersom jag inte ville gå in på alla olika modes som webbläsare hamnar i vilka olika DTD, felaktiga DTD eller inga DTD alls. Jag förutsätter att man praktiskt testar sitt jobb i olika läsare, och ibland kan man faktiskt vara tvungen att köra quirk's mode för att för nåt att bli som man vill.

Den här guiden är bra: http://hsivonen.iki.fi/doctype/

Anmäl Ändra Svara
#6
Ursprungligen av Danne V:

och ibland kan man faktiskt vara tvungen att köra quirk's mode för att för nåt att bli som man vill.

Den här guiden är bra: http://hsivonen.iki.fi/doctype/

Det har jag inte råkat ut för. Hur som helst - vill man absolut använda quirks mode är ett alternativ att ändå använda en DOCTYPE (förmodligen HTML 4.01 Transitional), men utan URL.

Och den guiden är bra, ja. Det finns flera andra.

Anmäl Ändra Svara
#7
  • Oregistrerad ●
  • 2005-03-03 13:01

Tack för allt idéer!

Klart det finns massor med andra lösningar... Frames, tabell i tabell, etc... Men det är ju himla konstigt att det blir så här. Borde inte den översta och den understa raden bli lika stora?

Anmäl Ändra Svara
#8
  • Medlem ●
  • Karlstad
  • 2005-03-03 13:56
Ursprungligen av Beez:

Tack för allt idéer!

Klart det finns massor med andra lösningar... Frames, tabell i tabell, etc... Men det är ju himla konstigt att det blir så här. Borde inte den översta och den understa raden bli lika stora?

Att se en bild säger tyvärr inte ett dugg. Du måste ge en länk till sidan ifråga om man ska kunna svara. ALLT beror nämligen på hur koden ser ut, och kan man inte se den, så kan man inte ge ett vettigt svar utan bara en massa gissningar.

Anmäl Ändra Svara
#9
  • Oregistrerad ●
  • 2005-03-03 20:54
Ursprungligen av Danne V:

Att se en bild säger tyvärr inte ett dugg. Du måste ge en länk till sidan ifråga om man ska kunna svara. ALLT beror nämligen på hur koden ser ut, och kan man inte se den, så kan man inte ge ett vettigt svar utan bara en massa gissningar.

Koden finns ju mitt första inlägg, eller rättare sagt koden för själva tabellen som jag sedan har dumpat och bifogat i mitt tidigare inlägg. Gjorde det för att det kan var lättare att se vad jag menar. Sidan finns ju inte uppe eftersom jag håller på att jobba med den...

Anmäl Ändra Svara
#10
  • Oregistrerad ●
  • 2005-03-03 21:06

Tack för alla tips på alla olika sätt det kan göras! Får se vilket sätt det bli i slutändan... tabell-i-tabell eller nån CSS-variant.

Tycker fortfarande det är konstigt att det inte funkar som det står i det första inlägget... men, men, så är det...

Anmäl Ändra Svara
#11
Ursprungligen av Beez:

Tack för allt idéer!

Klart det finns massor med andra lösningar... Frames, tabell i tabell, etc... Men det är ju himla konstigt att det blir så här. Borde inte den översta och den understa raden bli lika stora?

Jo, det är konstigt. Fick samma problem.

<table width="100%" height="100%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="middle">
xxx<br>
</td>
</tr>
<tr>
<td height="300" align="center" valign="middle">
xxx<br>
</td>
</tr>
<tr>
<td align="center" valign="middle">
xxx<br>
</td>
</tr>
</table>

Tabell-i-tabell löser som sagt problemet:

<table width="100%" height="100%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="middle">

<table width="100%" height="300" border="1" cellspacing="0" cellpadding="0">
<tr>
<td height="300" align="center" valign="middle">
xxx<br>
</td>
</tr>
</table>

</td>
</tr>
</table>
Anmäl Ändra Svara
#12
  • Medlem ●
  • Karlstad
  • 2005-03-03 16:04
Ursprungligen av Beez:

Tack för allt idéer!

Klart det finns massor med andra lösningar... Frames, tabell i tabell, etc... Men det är ju himla konstigt att det blir så här. Borde inte den översta och den understa raden bli lika stora?

Nej, eftersom webbläsaren inte vet vad du menar, dvs 100% av VAD. Den antar att du menar "100% av <body>" och alltså ritar den upp detta, även om du inte ser hela <body> i läsarfönstret.
Därför måste du tala om för webbläsaren hur du vill att den ska göra och definera både body och html.
Än en gång: Kolla länken till apptools.com och lägg in en tabell i en annan som jag beskrev tidigare, så är det klart.

Anmäl Ändra Svara
#13
Ursprungligen av Beez:

Men jag vill ju att mitten skall ha bestämd höjd...

Hur ska mitten få en bestämd höjd när du varken anger höjd i procent eller pixlar?

Anmäl Ändra Svara
#14
  • Oregistrerad ●
  • 2005-03-03 02:27

Problem är att den översta raden och den understa raden inte blir lika höga. Det är bara mittenraden jag vill skall vara fast (height = "300") Innehållet i den raden kommer inte att var större än så. Koden jag skrev i första inlägget stämmer så klart inte, så jag har ändrat det.

Det funkar inte att ta bort doctype och oavsett om jag har 100% eller 95% blir de inte lika höga.

Jag har testat vidare och även om jag inte har height 100% på tabellen utan sätter den till 500 och mitten raden till 300, kan jag inte få de båda andra raderna att bli lika höga...

Senast redigerat 2005-03-03 02:40
Anmäl Ändra Svara
#15
  • Medlem ●
  • Karlstad
  • 2005-03-03 07:30
Ursprungligen av Beez:

Problem är att den översta raden och den understa raden inte blir lika höga. Det är bara mittenraden jag vill skall vara fast (height = "300") Innehållet i den raden kommer inte att var större än så. Koden jag skrev i första inlägget stämmer så klart inte, så jag har ändrat det.

Det funkar inte att ta bort doctype och oavsett om jag har 100% eller 95% blir de inte lika höga.

Jag har testat vidare och även om jag inte har height 100% på tabellen utan sätter den till 500 och mitten raden till 300, kan jag inte få de båda andra raderna att bli lika höga...

Gör en tabell enligt länken jag gav tidigare. Ge den EN enda cell. Ge den cellen attributed valign="middle". Lägg in en ny tabell, 300px hög, INUTI den cellen.

Men "Innehållet i den raden kommer inte att var större än så" fungerar troligen inte om den är html-text och när anändaren ökar sin textstorlek.

Anmäl Ändra Svara
#16
  • Medlem ●
  • Karlstad
  • 2005-03-03 17:22

Klistra in detta i ett nytt dokument och kolla:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
	"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="imagetoolbar" content="no">
<meta name="MSSmartTagsPreventParsing" content="true">
<title>Standards Compliance Mode with CSS Rendering</title>
<style type="text/css">
body{color:#000; background-color: #fff;}
table{
	border: solid #008;
	border-width: 0 1px;
}
html, body{
	height:100%;
	margin: 0;
	padding: 0;
}
.fullheightTable{
	background-color: #ccccff;
	border: solid #008;
	border-width: 0 1px;
	height:100%;
	margin: 0 auto;
	text-align: center;
	vertical-align: middle;
}
#innerTable {
	background-color: #FFFFFF;
	height: 300px;
	width: 100%;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-weight: bold;
	color: #666666;
	text-align: center;
}
</style>
</head>
<body>
<table width="700" border="0" align="center" cellpadding="0" cellspacing="0" class="fullheightTable">
	<tr>
		<td><table width="100%"  border="0" cellspacing="0" cellpadding="0" id="innerTable">
<tr>
<td>Här är mitten-tabellen med 300px höjd. </td>
</tr>
</table>
</td>
	</tr>
</table>
</body>
</html>
Anmäl Ändra Svara
1
Bevaka tråden
Nytt i forumet
Debatterade nyheter
Senaste nytt
2 Hur ser ditt julpynt ut hemma?
0 3 ljusa tips för att hålla inbrottstjuvarna borta – använd smart belysning!
12 Slutet på något gammalt - början på något nytt
5 Rykte: Apple väntas lansera en uppdaterad 27" iMac i början av 2022
22 99mac blir Macradion på en helt ny plattform
1 Macradion: Vi släpper lös kraften tillsammans
0 Apple backar på den nya designen av Safari i macOS Monterey
24 Apple släpper macOS Monterey den 25 oktober
0 HomePod mini kommer i fler färger
91 Apple presenterar MacBook Pro, M1 Pro och M1 Max
4 Apple presenterar tredje generationens AirPods
2 Så här ser du Apples event ikväll
1 Apple Watch Series 7 - är det värt att uppgradera?
0 Macradion: Unleash the MF appstore
7 Detta tror vi att Apple visar upp på eventet
1 Apple förlänger sitt serviceprogram för AirPods Pro
0 Rykte: MacBook Pro har samma leverantör av miniLED-paneler som iPad Pro
3 Apple bjuder in till event den 18 oktober
1 BaseLynx: Modulär laddstation utan gränser
1 Tile håller koll på allt från plånbok till nycklar men saknar en nyckelfunktion
0 Apple överklagar domen för betalning genom tredjepartsutvecklare i App Store
Copyright © 2024. Allt innehåll tillhör Svenska Tekniknyheter AB. Citering är tillåten om källan anges. Vi reserverar oss för eventuella informationsfel.
Om 99, RSS, Kontakta oss, Feedback, Trivselregler, Teknisk information och cookies