---

Jeg vil gerne lave en div, 750 px bred, centreret på siden. Hvordan dælen
angiver man, at den skal centreres?

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."

---

"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> skrev i en meddelelse
news:b5ci3s$m3m$1@sunsite.dk...
> Jeg vil gerne lave en div, 750 px bred, centreret på siden. Hvordan dælen
> angiver man, at den skal centreres?

I css laver du en klasse:

#centrer{
position:absolute;
top:0px;
left:50%;
width: 750px;
margin-top:20px;
margin-left:-325px;
}

I dit dokument laver du:

<div id="centrer">Din sides indhold her</div>

--
Med venlig hilsen
Erik Ginnerskov - erik snabela ginnerskov dot dk
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/sorgin

---

"Erik Ginnerskov" <egin@SPAMKILLoncable.dk> skrev

> I css laver du en klasse:
>
> #centrer{
> position:absolute;
> top:0px;
> left:50%;
> width: 750px;
> margin-top:20px;
> margin-left:-325px;
> }
>
> I dit dokument laver du:
>
> <div id="centrer">Din sides indhold her</div>

OK - øhm - det er sq ikke skide centreret Den står faktisk en del for
meget til højre. Jeg kan ikke helt forstå, hvor du vil hen med de marginer,
men det ser umiddelbart ud som om, at du gør dig nogen antagelser om
størrelsen på mit browservindue. Det må du ikke - det skal naturligvis være
centreret, ligemeget hvor stort ens browservindue er.

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."

---

"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> wrote in message
news:b5cj1q$rr9$1@sunsite.dk...
> "Erik Ginnerskov" <egin@SPAMKILLoncable.dk> skrev
>
> > I css laver du en klasse:
> >
> > #centrer{
> > position:absolute;
> > top:0px;
> > left:50%;
> > width: 750px;
> > margin-top:20px;
> > margin-left:-325px;
> > }
> >
> > I dit dokument laver du:
> >
> > <div id="centrer">Din sides indhold her</div>
>
> OK - øhm - det er sq ikke skide centreret Den står faktisk en del for
> meget til højre. Jeg kan ikke helt forstå, hvor du vil hen med de
marginer,
> men det ser umiddelbart ud som om, at du gør dig nogen antagelser om
> størrelsen på mit browservindue. Det må du ikke - det skal naturligvis
være
> centreret, ligemeget hvor stort ens browservindue er.

Erik gør sig ingen tanker om browservinduets størrelse, han ved bare at
box-en skal være 750 px. bred.
Teknikken går herefter ud på, at placere boksens øverste venstre hjørne midt
i browservinduet, og herefter trække boxens margen en halv boxbredde ud over
boxens kant mod venstre (margin-left: -325 px).
Princippet skulle være godt nok, men mon ikke boxens bredde så skal sættes
til 325 også for at det skal virke?
Ret width: 750px til 325px, og se om det bliver bedre.

Den må iøvrigt opføre sig ganske mærkværdigt ved vinduesbredder under 750
pixler.

/Per

---

"Per Christoffersen" <pc@snydcomonto.dk> skrev

> Erik gør sig ingen tanker om browservinduets størrelse, han ved bare at
> box-en skal være 750 px. bred.
> Teknikken går herefter ud på, at placere boksens øverste venstre hjørne
midt
> i browservinduet, og herefter trække boxens margen en halv boxbredde ud
over
> boxens kant mod venstre (margin-left: -325 px).
> Princippet skulle være godt nok, men mon ikke boxens bredde så skal sættes
> til 325 også for at det skal virke?
> Ret width: 750px til 325px, og se om det bliver bedre.

Ach so - nu kan jeg se det! Smart. Jeg skal ikke rette width til 325px, for
så bliver div'en kun 325 pixels bred. Derimod skal jeg rette margin-left fra
325px til 375px, som jo er halvdelen af 750 Så virker det.

> Den må iøvrigt opføre sig ganske mærkværdigt ved vinduesbredder under 750
> pixler.

Ja, det er klart. Men hvem kører også med vinduesbredder under 750 pixler?

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."

---

"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> skrev
> "Per Christoffersen" <pc@snydcomonto.dk> skrev

> Ach so - nu kan jeg se det! Smart. Jeg skal ikke rette width til 325px,
for
> så bliver div'en kun 325 pixels bred. Derimod skal jeg rette margin-left
fra
> 325px til 375px, som jo er halvdelen af 750 Så virker det.

Sorry, regnefejl. Jeg blev forstyrret af noget anden, mens jeg sad og skrev.

--
Med venlig hilsen
Erik Ginnerskov - erik snabela ginnerskov dot dk
http://www.hjemmesideskolen.dk - http://www.html-faq.dk
http://hjem.get2net.dk/sorgin

---

Steen Eiler Jørgensen wrote:

> [...] Men hvem kører også med vinduesbredder under 750 pixler?

Svært at sige. Hvem kører med vinduesbredder over 750 pixels?
<url: http://html.dk/artikler/00025/ >
--
Toke Eskildsen <URL:http://www.daimi.au.dk/~darkwing/>

---

"Toke Eskildsen" <darkwing@daimi.au.dk> skrev

> Svært at sige. Hvem kører med vinduesbredder over 750 pixels?
> <url: http://html.dk/artikler/00025/ >

Ja, jeg ved godt, at man bør kunne se siden med alle mulige mærkelige
browserstørrelser, men hvordan fortæller jeg et div, at det skal være "lige
så bredt som browserbredden minus 10 pixels i hver side, dog max. 750
pixels" uden at skulle ud i noget JavaScript-detektering af browserens
bredde?

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."

---

Steen Eiler Jørgensen skrev:

> --
> Steen Eiler Jørgensen
> "No, I don't think I'll ever get over Macho Grande.
> Those wounds run...pretty deep."

Bare af ren nysgerrighed... hvad betyder sådan et citat, og hvad er
sammenhængen? Jeg spørger af ren nysgerrighed og udenfor dit spørgsmål...

Olav

---

Per Christoffersen skrev:

>> OK - øhm - det er sq ikke skide centreret

> Den må iøvrigt opføre sig ganske mærkværdigt ved
> vinduesbredder under 750 pixler.

Ja. Er der nogen grund til at benytte Eriks model (med negativ
margen) fremfor blot at angive en fast bredde og flydende margner
(samt et passende IE-hack)

Her er mit forslag:

<div style="width: 750px; margin: auto; border: thin solid red;">
<p>Her er en centreret div med bredden 750 px.</p>
</div>

Det virker i alle nyere browsere når der benyttes en
standardsættende 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

---

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev

> Ja. Er der nogen grund til at benytte Eriks model (med negativ
> margen) fremfor blot at angive en fast bredde og flydende margner
> (samt et passende IE-hack)
>
> Her er mit forslag:
>
> <div style="width: 750px; margin: auto; border: thin solid red;">
> <p>Her er en centreret div med bredden 750 px.</p>
> </div>

Øj ja - margin:auto fungerer altså som en god, gammeldags <center>-kommando?
Fikst.

Hvad mener du med "passende IE-hack"? Det fungerer fint i min IE.

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."

---

Steen Eiler Jørgensen skrev:

> Øj ja - margin:auto fungerer altså som en god, gammeldags
> <center>-kommando? Fikst.

Ja - bortset fra at ældre IE-versioner ikke forstår den.

> Hvad mener du med "passende IE-hack"? Det fungerer fint i min
> IE.

Prøv at fjerne din doctype og se hvordan det så virker.

--
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

---

"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> writes:

> OK - øhm - det er sq ikke skide centreret Den står faktisk en del for
> meget til højre.

Den er ca. 50 pixels for langt til højre, for det skulle have været
margin-left: -375px
(minus halvedelen af bredden).

Prøv det.

> Jeg kan ikke helt forstå, hvor du vil hen med de marginer, men det
> ser umiddelbart ud som om, at du gør dig nogen antagelser om
> størrelsen på mit browservindue. Det må du ikke - det skal
> naturligvis være centreret, ligemeget hvor stort ens browservindue
> er.

Det gør det skam også, når der ikke lige smutter 50 pixels i
hovdregningen :)
/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'

---

Steen Eiler Jørgensen skrev:

> Ja, jeg ved godt, at man bør kunne se siden med alle mulige
> mærkelige browserstørrelser, men hvordan fortæller jeg et div,
> at det skal være "lige så bredt som browserbredden minus 10
> pixels i hver side, dog max. 750 pixels" uden at skulle ud i
> noget JavaScript-detektering af browserens bredde?

#dindiv{
   margin-left: 10px;
   margin-right: 10px;
   max-width: 750px;
}

Margin-left|right forstås af de fleste browsere - det er nok mere
tvivlsomt med max-width.

Husk at bruge en standardsættende doctype hvis margen-
indstillingerne skal virke korrekt.
--
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

---

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev

> #dindiv{
> margin-left: 10px;
> margin-right: 10px;
> max-width: 750px;
> }
>
> Margin-left|right forstås af de fleste browsere - det er nok mere
> tvivlsomt med max-width.
>
> Husk at bruge en standardsættende doctype hvis margen-
> indstillingerne skal virke korrekt.

Med doctype-erklæringen

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

virker det ikke i IE 6.0.2800.1106 - den bliver ligeså bred som hele
browseren.

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."

---

"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> writes:

> Med doctype-erklæringen
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
>
> virker det ikke i IE 6.0.2800.1106 - den bliver ligeså bred som hele
> browseren.

Den forstår ikke max-width, så din div får standardbredden for et
block-element: 100%.

Man kan ikke fortælle IE at noget maksimalt skal have en bredde på
750px, desværre. Det er en skodbrowser (efter moderne standarder), men
man må jo desværre lære at leve med den.

Mit bedste forslag er at lave et design der også virker over og under
750px bredde.

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit.html>
'Faith without judgement merely degrades the spirit divine.'

---

Steen Eiler Jørgensen skrev:

> virker det ikke i IE 6.0.2800.1106 - den bliver ligeså bred
> som hele browseren.

Kan vi få et link til siden?
--
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

---

"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev

> Kan vi få et link til siden?

http://www.fys.ku.dk/~sej/test14.htm

--
Steen Eiler Jørgensen
"No, I don't think I'll ever get over Macho Grande.
Those wounds run...pretty deep."

---

"Steen Eiler Jørgensen" <oz1sejREMOVETHIS@get2net.dk> skrev :

>http://www.fys.ku.dk/~sej/test14.htm

En <div> i en <div> skulle gøre det.
<div style="margin-right: 10px;margin-left: 10px">
<div style="margin-left: auto; margin-right: auto; max-width:
750px; border: 1px solid #CC0000;">
Denne div skulle gerne være centreret i browseren samt
tilpasse sig
brugerens browserstørrelse, dog må den ikke blive bredere
end 750
pixels.
</div>
</div>

Testet i Mozilla 1.3 og Opera 7.03, IE kan ikke finde ud af
max-width.

--
Knud - http://home13.inet.tele.dk/smedpark/
Når der svares på et indlæg, svar venligst under det citerede og
skær venligst det væk, du ikke svarer på, ellers ryger du i killfiltret.
Svar kun i nyhedsgruppen - tak! E-mails besvares ikke.