/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Fra absolut til relativ enhed?
Fra : Morten Sørensen


Dato : 01-10-03 19:27

Hej gruppe!

Jeg har fået lavet min første kode indeholdende css, men har i første omgang
defineret alle div's med relative enheder. Dem vil jeg gerne have lavet om
til absolutte enheder, så sitet tilpasser sig browser vinduet. Jeg har nu
prøvet mig frem i stykke tid, men kan ikke få det til at passe, når jeg
bruger absolutte enheder. I den forbindelse har jeg et par spørgsmål.

Hvordan får jeg det til at passe med absolutte enheder - måske er der én,
der vil hjælpe?

Hvordan undgår jeg, at jo mere tekst jeg fylder i boksen "indhold", desto
længere bliver boksen? Hvis der tilføjes mere tekst i denne boks, så skulle
den gerne holde sine mål, men istedet fremkommer der en venstre eller højre
scroller?

Min kode er:

<!-- saved from url=(0022)http://internet.e-mail -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>

body {
text-align: center;
}

div {
font-family: verdana;
font-size: 12px;
padding: 5px;
}

div#frame {
padding: 0px;
width: 500px;
height: 400px;
}

div#topmenu {
text-align: left;
width: 500px;
border-top: 2px solid #c0c0c0;
}

div#undermenu {
text-align: left;
width: 500px;
border-top: 2px solid #c0c0c0;
}

div#indhold {
color: #ffffff;
width: 300px;
height: 300px;
background-color: #000000;
float: left;
}

div#billede {
padding: 0px;
width: 100px;
height: 300px;
background-color: #ffffff;
float: left;
}

div#right {
color: #ffffff;
width: 100px;
height: 300px;
background-color: #000000;
float: left;
}

</style>
</head>

<body>
<div id="frame">
<div id="topmenu">Kontakt</div>
<div id="undermenu">under links</div>
<div id="indhold">Indhold</div>
<div id="billede">Billede</div>
<div id="right">bahh</div>
</div>
</body>
</html>


--
Mvh.
Morten

moso97ad-no-spam@yahoo.dk
(fjern -no-spam)



 
 
Jens Gyldenkærne Cla~ (01-10-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 01-10-03 22:48

Morten Sørensen skrev:

> første omgang defineret alle div's med relative enheder.

Hvad forstår du ved relative enheder? I din kode er alle størrelser
så vidt jeg kan se angivet i pixels. Men du mener måske floats?

> Dem vil jeg gerne have lavet om til absolutte enheder, så sitet
> tilpasser sig browser vinduet.

Hvis du ikke sætter specifikke bredde- og højdeangivelser på dit
site, vil det tilpasse sig helt af sig selv. Hvis du bruger det som
jeg forstår ved relative enheder - nemlig procent - vil det også
tilpasse sig (dog på en lidt anden måde).

Prøv at forklare lidt mere specifikt hvad du gerne vil opnå. Læs
evt. artiklen her først: <http://infimum.dk/HTML/hjaelpmig.html>.


> Hvordan får jeg det til at passe med absolutte enheder - måske
> er der én, der vil hjælpe?

Fortæl hvordan det skal "passe" - så er det lettere at hjælpe.


> Hvordan undgår jeg, at jo mere tekst jeg fylder i boksen
> "indhold", desto længere bliver boksen?

Giv boksen en fast højde og sæt overflow til scroll (jf:
<http://www.w3.org/TR/CSS21/visufx.html#propdef-overflow>)


> Min kode er:

[klip]

Giv hellere et link til din side. Det er svært at overskue kode i
et newsprogram - browsere er langt bedre til den slags.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Morten Sørensen (01-10-2003)
Kommentar
Fra : Morten Sørensen


Dato : 01-10-03 23:19

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev i en meddelelse
news:Xns9407F2110F636jcdmfdk@gyrosmod.cybercity.dk...
> Morten Sørensen skrev:
>
> > første omgang defineret alle div's med relative enheder.
>
> Hvad forstår du ved relative enheder? I din kode er alle størrelser
> så vidt jeg kan se angivet i pixels. Men du mener måske floats?

Jeg har skrevet forkert, for jeg mente, at min div'er var angivet som
absolut (altså pixels). Dermed mener jeg også, at mit site vil blive
utroligt småt, hvis der sidder én med en browserstørrelse på over 1024x768.
Og hvis det er én med en lavere browserstørrelse, så kan jeg måske risikere,
at der skal scrolles horizontalt. Jeg mener derfor, at jeg ved at angive
alle div'ere som relativ (altså pct.), så kan jeg undgå dette.

> Fortæl hvordan det skal "passe" - så er det lettere at hjælpe.

Her i dag har jeg siddet længe og forsøgt at ændre fra pixels til pct., men
hver gang ser det ud ad h til. Jeg kan godt få Top- og undermenu til at stå
rigtigt (centreret), men Indhold, billede og bahh holder sig i venstre side.
Det jeg er ude efter, er én der kan få sat de rigte procentsatser på, så det
ser ordentligt ud i browseren.

> Giv hellere et link til din side. Det er svært at overskue kode i
> et newsprogram - browsere er langt bedre til den slags.

Jeg kan ikke give et link, da jeg ikke har et webhotel endnu.

Mvh.
Morten



Allan Vebel (01-10-2003)
Kommentar
Fra : Allan Vebel


Dato : 01-10-03 23:48

Morten Sørensen <moso97ad-no-spam@yahoo.dk> skrev:

> Jeg kan ikke give et link, da jeg ikke har et webhotel endnu.

Normalt har du 10-20MB serverplads til rådighed hos din
internetudbyder - det kan du sagtens bruge til testformål.

--
Allan
http://html-faq.dk



Morten Sørensen (02-10-2003)
Kommentar
Fra : Morten Sørensen


Dato : 02-10-03 01:00

"Allan Vebel" <nospam@vebel.dk> skrev i en meddelelse
news:blflj0$3uk$1@sunsite.dk...
> Morten Sørensen <moso97ad-no-spam@yahoo.dk> skrev:
>
> > Jeg kan ikke give et link, da jeg ikke har et webhotel endnu.
>
> Normalt har du 10-20MB serverplads til rådighed hos din
> internetudbyder - det kan du sagtens bruge til testformål.
>
> --
> Allan
> http://html-faq.dk

Desværre har jeg ikke en Internetudbyder som Cybercity el. lign., men er
medlem af den lokale antenneforening, som har deres eget net. Hvor jeg mig
bekendt ikke har adgang til serveren, så jeg evt. kan uploade noget. Men
måske jeg kunne måske lokke jer til at kopiere min kode ind i frontpage,
dreamweaver el. lign. Ellers må jeg jo klare det uden jeres hjælp

Mvh.
Morten



Morten Sørensen (02-10-2003)
Kommentar
Fra : Morten Sørensen


Dato : 02-10-03 01:27

"Allan Vebel" <nospam@vebel.dk> skrev i en meddelelse
news:blflj0$3uk$1@sunsite.dk...
> Morten Sørensen <moso97ad-no-spam@yahoo.dk> skrev:
>
> > Jeg kan ikke give et link, da jeg ikke har et webhotel endnu.
>
> Normalt har du 10-20MB serverplads til rådighed hos din
> internetudbyder - det kan du sagtens bruge til testformål.
>
> --
> Allan
> http://html-faq.dk

Kom lige på bedre tanker...hi hi.

Her er linket http://www.tune.dk/ms/test/hest.htm

Mit problem ligger simpelthen i, at det ser fint ud med, at angive højde og
bredde i pixels. Men det er jo ikke så smart ifølge denne artikel
http://www.html.dk/artikler/00023/, derfor har jeg leget med forskellige
procentsatser - uden held. Det hele ser helt forkert ud efterfølgende.

Mit næste problem er, at top- og undermenu ikke holder højden. Hvis jeg
eksempelvis indsætter en del bogstaver, så ryk det ned på næste linie. Det
skulle det helst ikke gøre.

Det samme er tilfældet med de tre bokse kaldet "indhold", "billede" og
"baah". Der kan jeg heller ikke indsætte noget tekst, uden at boksen bare
bliver størrere og størrere.

Håber I kan hjælpe nu.

Mvh.
Morten



Jens Gyldenkærne Cla~ (02-10-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 02-10-03 10:07

Morten Sørensen skrev:

> Mit problem ligger simpelthen i, at det ser fint ud med, at
> angive højde og bredde i pixels.

Hm - du har vist ikke set din side i min browser:

<http://damu.dk/jc/usenet/tune.dk_dump.gif>

Forskellen skyldes at din side sætter quirks mode - her opfatter IE
og Mozilla breddeangivelser forskelligt. Med en standardsættende
doctype kan du få ensartet visning på tværs af browsere (bemærk dog
at det er IE der vil ændre visning til det "forkerte" hvis du
skifter).

Se mere om fænomenet - kaldet doctype switching - her:
<http://gutfeldt.ch/matthias/articles/doctypeswitch.html> og
her: <http://www.html.dk/artikler/00036/>


> Men det er jo ikke så smart
> ifølge denne artikel http://www.html.dk/artikler/00023/,


Den artikel er i mine øjne ret uheldigt formuleret. Jonas Astrup
stiller det op som om man skal vælge mellem absolutte og relative
enheder - vælger man absolutte enheder har man et låst design og
vælger man relative enheder har man et skalerbart design.

Men ofte vil man lave skalerbart design ved at låse _nogle_
elementer og lade andre skalere. HTML.dk gør det sådan set selv!
Menuen i venstre side er altid 150 pixels, mens resten af siden kan
skalere. Med en sideopbygning med faste elementer (menu, evt.
logoer, bannere o.l.) kombineret med et indholdsområde, er det kun
sidstnævnte der skal skalere.


> derfor har jeg leget med forskellige procentsatser - uden
> held. Det hele ser helt forkert ud efterfølgende.

Næste problem med Jonas Astrups artikel er at han anbefaler at
benytte procent-værdier for at få et skalerbart design. Igen - prøv
at kigge på opbygningen af HTML.dk. Siden skalerer fint - men der
er ikke angivet nogen procent-værdi til bredde eller højde. Humlen
er at man skal nøjes med at specificere bredde og højde der hvor
man har brug for det - så skalerer resten af sig selv.

Procent-værdier kan være o.k. til at lave lidt luft om en side.
Skriver man fx <hr style="width: 80%" /> får man en vandret linje
der fylder 80 % af den omgivende boks. De er derimod ikke velegnet
til at opbygge designet på en side.

Prøv at se artiklen her: <http://html-faq.dk/2003.asp> - den
beskriver hvordan man kan lave skalerbart design med position
absolute.


> Mit næste problem er, at top- og undermenu ikke holder højden.
> Hvis jeg eksempelvis indsætter en del bogstaver, så ryk det
> ned på næste linie. Det skulle det helst ikke gøre.

Det er ikke helt nemt at arbejde med floats til spalteopbygning.
Overvej om du kan bruge positionering i stedet. Start med at finde
ud af hvordan din sideopbygning skal være - hvilke elementer skal
være faste og hvilke skal kunne skalere, er der elementer som skal
"følges ad" o.s.v.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Morten Sørensen (02-10-2003)
Kommentar
Fra : Morten Sørensen


Dato : 02-10-03 16:18

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev i en meddelelse
news:Xns9408710F1963Djcdmfdk@gyrosmod.dtext.news.tele.dk...
> Morten Sørensen skrev:
>
> Forskellen skyldes at din side sætter quirks mode - her opfatter IE
> og Mozilla breddeangivelser forskelligt. Med en standardsættende
> doctype kan du få ensartet visning på tværs af browsere (bemærk dog
> at det er IE der vil ændre visning til det "forkerte" hvis du
> skifter).
>
> Se mere om fænomenet - kaldet doctype switching - her:
> <http://gutfeldt.ch/matthias/articles/doctypeswitch.html> og
> her: <http://www.html.dk/artikler/00036/>

Det her har jeg ikke så meget styr på, men har prøvet at ændre til
forskellige doctypes uden det store held.

Mvh.
Morten



Jens Gyldenkærne Cla~ (03-10-2003)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 03-10-03 10:04

Morten Sørensen skrev:

> Det her har jeg ikke så meget styr på, men har prøvet at ændre
> til forskellige doctypes uden det store held.

Hvis IE's doctype switch skal aktiveres, skal doctypeerklæringen
være det første i filen. Du har følgende kommentar øverst:

<!-- saved from url=(0022)http://internet.e-mail -->


Derfor ændrer IE ikke opførsel selv om du skifter doctype.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Morten Sørensen (03-10-2003)
Kommentar
Fra : Morten Sørensen


Dato : 03-10-03 11:18

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev i en meddelelse
news:Xns940970A4EB9C8jcdmfdk@gyrosmod.dtext.news.tele.dk...
> Hvis IE's doctype switch skal aktiveres, skal doctypeerklæringen
> være det første i filen. Du har følgende kommentar øverst:
>
> <!-- saved from url=(0022)http://internet.e-mail -->
>
>
> Derfor ændrer IE ikke opførsel selv om du skifter doctype.

Den havde jeg lige overset, men tak for hjælpen endnu en gang

Mvh.
Morten



Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408849
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste