webForumDet fria alternativet
Logga in / Bli medlem

Höjd i procent

HTML & CSS

18 svar · 507 visningar · startad av Web-Tor

Web-Tors avatarWeb-TorMedlem sedan nov. 200013 890 inlägg
Frågan#1

Har jag missat nåt? Går det inte att ange höjden på ett lager i procent i Explorer?

Det här funkar i Netscape 6 men inte i IE 6:

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
	<title></title>
	<style type="text/css">
	<!--
	#layer {
		position: absolute;
		top: 0px;
		left: 0px;
		width: 200px;
		height: 50%;
		border: 1px solid #555;
	}
	-->
	</style>
</head>

<body>

	<div id="layer">Text</div>

</body>
</html>
DinoMedlem sedan sep. 20011 914 inlägg
#2
<body style="height: 100%">
Web-Tors avatarWeb-TorMedlem sedan nov. 200013 890 inlägg
#3

Ahh!! Tusen tack! :)

Nu till nästa lilla problem:

Kolla på den här sidan med Mozilla eller Netscape 6+.

Om man förminskar fönstret så att skrollen kommer fram så blir det fult när man sedan skrollar neråt. Bakgrundsfärgen hänger inte med.

PallemanMedlem sedan dec. 2000557 inlägg
#4

Jag har haft ett liknande problem..
Löste det så att jag använde en bakgrundsbild i body istället som jag bara repeterade repeat-y left, fungerade mycket bättre. :)

Web-Tors avatarWeb-TorMedlem sedan nov. 200013 890 inlägg
#5

Löste det så att jag använde en bakgrundsbild i body istället som jag bara repeterade repeat-y left, fungerade mycket bättre.

Det är så jag har det idag. ;)
Grejen är att jag vill använda lager med bakgrundsfärg för att lättare kunna ändra utseendet på sidan.

PallemanMedlem sedan dec. 2000557 inlägg
#6

Ok, fresta på med att sätta height:110%; så slipper du problemet.. dock kommer ju alltid scrollern att finnas där.. :/

/r: På div´n alltså.. :)

 

Web-Tors avatarWeb-TorMedlem sedan nov. 200013 890 inlägg
#7

Jag blir inte av med problemet även om jag sätter 110% på lagret.

PallemanMedlem sedan dec. 2000557 inlägg
#8

Hmm.. detta ser bra ut med Mozilla hos mig iaf..

Web-Tors avatarWeb-TorMedlem sedan nov. 200013 890 inlägg
#9

Jo, men om du har lite mer text på sidan så funkar det inte.

Testa

PallemanMedlem sedan dec. 2000557 inlägg
#10

Mmm.. sant. Måste du ha mer text på sidan då? ;)
Nä ärligt talat så testade jag inte det.. :r

Men.. hmm..det går bra till en viss gräns, sedan fuckar det till sig.
Det går fin fint tills dess att texten måste scrollas.. damn.

SDCdMedlem sedan jan. 2001795 inlägg
#11

Och du kan inte låta bli att ange höjden? Bara låta den följa innehållet?
/red
Glöm det, funkar ju inte i fullskärmsläge.

Web-Tors avatarWeb-TorMedlem sedan nov. 200013 890 inlägg
#12

Och du kan inte låta bli att ange höjden? Bara låta den följa innehållet?

Grejen är just att lagret ska gå ända ner, oavsett textmassans längd.

SDCdMedlem sedan jan. 2001795 inlägg
#13

Hittade en tutorial som jag inte själv hinner titta igenom, men vad jag kunde se vid en snabb genomgång så fyller han en hel sida en bit ner i beskrivningen.

Tutorial:
http://webreference.com/authoring/style/sheets/layout/advanced/

Här har han hela sidan fylld:
http://webreference.com/authoring/style/sheets/layout/advanced/step_04.html

Exemplet är det som ligger precis innan han adderar TopBar och AdBar.

Vet inte om det är till nån hjälp

Web-Tors avatarWeb-TorMedlem sedan nov. 200013 890 inlägg
#14

Anledningen till att bakgrunden tar upp hela skärmen på sidan du länkar till är att det är så mycket text att texten "puttar ut" bakgrunden hela vägen ner.

Tar man bort en del av texten så att den bara tar upp halva fönstret så sträcker sig även backgrunden över halva fönstret.

SDCdMedlem sedan jan. 2001795 inlägg
#15

Asch då, sorry.

jarvkloMedlem sedan juli 20013 378 inlägg
#16

Hmm....
Det kluriga du slåss med är att även absolutpositionerade block ("layers") alltid (trots namnet!) är positionerade i förhållande till koordinaterna för sina "containing blocks" enligt CSS2...
I ditt fall hamnar din positionering relativt till dokumentets rotelement (body)...

Vilket gör att det du anger till 100% bör vara höjden på rotelementets "containing block", dvs höjden på webbläsarens "Viewport"... Vilket (om min tolkning av specen är rätt) skulle förklara beteendet i Mozilla/NN6...

Exakt varför det skiljer mellan Moz/NN och MSIE har jag dock inte lyckats klura ut, men om du provar att fylla ut din sida med en div till som "flödar ut innehåll över nederkanten" så ser du att du inte får 100% av innehållets höjd i MSIE6 heller... (det verkar som om MSIE6 "mekar till" ett containing block för ditt lager efter storleken på dess innehåll...)

CSS2-specen om hur containing blocks skall räknas ut:
http://www.w3.org/TR/REC-CSS2/visudet.html#containing-block-details
(kolla speciellt in speciellt exemplen - det andra liknar din kod rejält ;) )...

Jag har för mig att jag sett en workaround på nätet nånstans...
Lägger in det i bakhuvudet och återkommer om jag hittar en länk eller ett exempel som funkar...

Red: Tagit bort mitt länktips, som visade sig vara en dublett (se nedan :e )

SDCdMedlem sedan jan. 2001795 inlägg
#17

jarvklo skrev:

Tills vidare kan jag tipsa om den här artikeln, som åtminstånde gav mig en hel del insikter, eftertankar och ideer som jag haft nytta av... ;)

Känner igen den länken nånstans ifrån... ;)

jarvkloMedlem sedan juli 20013 378 inlägg
#18

Oops - missade att du redan tipsat om den och att den inte löste problemet :r
Redigerar bort misstaget - tack! :birp

SDCdMedlem sedan jan. 2001795 inlägg
#19

No Problemo! :)
En sådan matnyttig länk kan inte nämnas för många gånger

252 ms totalt · 4 externa anrop · v20260731065814-full.1dc6f849
116 ms — deklarationer (db)
0 ms — hämta statistik (cache)
132 ms — hämta tråd, inlägg och bilagor (db)
118 ms — ändringar (db)