CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

dorgbar Nybegynder

28. december 2004 - 15:54 Der er 5 kommentarer og
1 løsning

længde/højde angivet i % og px

jeg vil gere have at vide om det er muligt at angive en længde på et objekt i både pixels og % så man f.eks kan lave et tag
<tag style="Width: 100% -20px">
så tagget altså fylder hele skærmen udover 20 pixels.

Synes godt om

frol Nybegynder

29. december 2004 - 00:52 #1

Hvad med
width: 100%;
margin: 0 20px; ?

Synes godt om

roenving Novice

29. december 2004 - 12:34 #2

>>frol

-- ikke så god en ide, da elementet så vil have en bredde på 100% og så vil de margin komme udenpå, så ialt vil bredden blive 100% + 40px !-)

Men et lille trick kan klare den:

<div style="margin:20px 20px;">
<div style="background:green;">
Denne div er 100% bred - 40px
</div>
</div>

-- som det fremgår kan du ikke umiddelbart lave en ting, som er 100% høj, men så kan man tricke endnu mere:

<div style="position:relative;margin:0 20px;border:0px;height:100%;">
<div style="background:green;height:100%;z-index:1;">
<div style="height:20px;"></div>
Denne div er 100% bred - 40px og ser ud som om den er 100% - 40px høj
<div style="height:20px;"></div>
</div>
<div style="height:20px;position:absolute;top:0px;background:white;z-index:2;width:100%;"></div>
<div style="height:20px;position:absolute;bottom:-1px;background:white;z-index:2;width:100%;"></div>
</div>

(Kiggede ikke så meget på det, at jeg fandt ud af de -1px, men det er der nok en forklaring på !-)

-- det er i begge eksempler en forudsætning, at du har noget, som ligner dette med i dit stylesheet:

html,body{
margin:0;
padding:0;
border:0;
height:100%;
}

-- og en fuldt kvalificeret doctype inklusive dtd-link, så f.eks.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 strict//EN"
"http://www.w3.org/TR/html401/strict.dtd">
<html>
<head>
<title>Fuld højde simpelt</title>
<meta name="Generator" content="Stone's WebWriter 4">
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/497362">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html,body{height:100%;margin:0px;padding:0px;}
#banner{position:absolute;height:125px;width:100%;background:yellow;z-index:1;}
#top1{width:100%;height:50px;background:#770;}
#top2{width:100%;height:75px;background:#707;}
#main{height:100%;background:green;}
#spacer{height:125px;}
#bottom{position:absolute;bottom:0px;height:125px;width:100%;background:yellow;z-index:1;}
#bund1{width:100%;height:25px;background:#770;}
#bund2{width:100%;height:100px;background:#707;}
</style>
</head>
<body>
<div id="banner">
<div id="top1">top1</div>
<div id="top2">top2</div>
</div>
<div id="main">
<div id="spacer">Usynligt</div>
Hovedside</div>
<div id="bottom">
<div id="bund1">bund1</div>
<div id="bund2">bund2</div>
</div>
</body>
</html>

Synes godt om

dorgbar Nybegynder

29. december 2004 - 20:18 #3

tjaa ser ud til at virke fint, fik også lige nogle andre gode ting uyd af din kode :) height:100%; løste nogle andre problemmer jeg havde :D så bare opret svar

Synes godt om

frol Nybegynder

29. december 2004 - 22:57 #4

>>roenving
Jeez! den tænkte jeg ikke rigtigt igennem, hvad :-!

Flotte løsninger!
Den der -1px ting, ses "kun" i IE6, ikke i Gecko'erne...

Synes godt om

roenving Novice

30. december 2004 - 12:31 #5

Velbekomme '-)

Synes godt om

roenving Novice

16. maj 2005 - 16:42 #6

-- og tak for point ;~}

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Variabler som ikke virker Af Frits Jensen i HTML	2	30/10/202409:37	30/10/202413:04
Aldersbegrænsning på min hjemmeside Af ØLMANDEN i HTML	2	29/09/202410:58	30/09/202412:04
Bredde på div elementer Af dane022 i HTML	2	16/02/202408:29	20/02/202412:50
Hvilken mindste mobilstørrelse til hjemmeside Af CSharpRazor i HTML	2	21/12/202322:51	22/12/202308:03
validering <input tlfnr. Af slein55 i HTML	5	15/10/202311:43	15/10/202314:51

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS

12:00

Ugen i tech: El-kolos kan fragte syv personer over 620 kilometer / Sony er klar med ny kamera-konge: Alpha 1 mk II

22/11

Test: Den snusfornuftige Volkswagen ID.3 blevet til lidt af el-bisse

22/11

Vil købe tele-løsninger til det offentlige for 370 millioner kroner

22/11

Nørgaard: Det er de neuro-divergente originalers tid

22/11

Sker helt åbenlyst: Ansatte i den kinesiske stat sælger borgernes personlige data på hemmelige internet-fora

22/11

Efterspørgslen på AI-regnekraft er enorm - og det smitter af på priserne: "Vi kan sælge næsten alt, hvad vi får ind"

22/11

Derfor bliver den amerikanske tvangs-opdeling af Google nok ikke til noget

22/11

Nyt værtøj fra Microsoft: Snart kan du reparere nedbrudte Windows-enheder på distancen

22/11

Vi har fundet 10 ledige it-stillinger, som du kan søge netop nu

22/11

Politiet skriver kontrakt på 75 millioner kroner med dansk it-firma: Medarbejdere skal flytte ind hos politiet

22/11

Kombit gør klar til at købe it-konsulenter for 140 millioner kroner - her er planen

Vis flere artikler

IT-JOB

Region Midtjylland

Infrastrukturarkitekt til Digitalisering og It i Region Midtjylland

Itm8

CRM-konsulent

Udviklings- og Forenklingsstyrelsen

Gi' din karriere et løft som projektstyringsekspert i Danmarks største offentlige it-organisation

Itm8

CRM-produktejer med bred Microsoftprofil

IST ApS

Head of Cloud Services

Vis flere jobs

Seneste spørgsmål Seneste aktivitet

I går 18:09	Billedoverførsel Af Laurids i iOS, iPhone & iPad
I går 13:30	Hvordan ændres UniFi Dream Machine UDM til switch mode Af Kasper4450 i Internetforbindelser
I går 13:01	Film går i stå midt i afspilningen Af ole falsted i Musik & videoafspillere
I går 11:40	Fjerne mappe i stifinder Af Peter Olsen i Andet software
I går 11:27	renteberegning Af Pil i Excel