Avatar billede ekfeldt_net Nybegynder
05. september 2005 - 09:31 Der er 11 kommentarer og
1 løsning

Centrer hjemmeside

Jeg er ikke rutineret i Dreamweaver. Jeg mener dette burde være enkelt, men det har dog voldt mig lidt problemer:
Jeg har lavet hjemmesiden: www.ekfeldt.net/hypnagogia/
Siden er simpelt opbygget i Dreamweaver MX med indsatte billeder og ved brug af overliggende "layers" med tekst.
Siden er som udgangspunkt orienteret i venstre side, men jeg vil gerne have det hele centreret...

Jeg kan godt "align" billeder hver for sig så de ligger centreret, men de enkelte tekst-layers osv. skal naturligvis ikke ligge i centrum.
Er der et flueben i Dreamweaver eller en HTML-kode der kan rette op på dette?
Avatar billede Slettet bruger
05. september 2005 - 09:35 #1
nu er jeg ikke haj til html men du kan enten gøre det her :
<body bgcolor="#CCCCCC" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> ( din html kode )

eller skrive
<center> ovenover body og afslut med </center> under </body>
Avatar billede Slettet bruger
05. september 2005 - 09:36 #2
Det er en meget flot banner du har lavet..hvilken program har du brugt ??
Avatar billede ekfeldt_net Nybegynder
05. september 2005 - 09:55 #3
Hej dhil, tak for det hurtige svar.
Jeg anvender i forvejen koden:
<body bgcolor="#CCCCCC" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

Metoden med at skrive:
<center> ovenover body og afslut med </center> under </body>
virker perfekt på billederne, men ikke mine tekst-layers, de bliver stående i venstre side?
Jeg overvejer om det skyldes at layerne er sat til "absolute":
<div id="Layer1" style="position:absolute; left:62px; top:286px; width:235px; height:261px; z-index:1">
Hvad er alternativet til "absolute"?

Banneret har jeg lavet i Illustrator - et godt værktøj til den slags.
Avatar billede Slettet bruger
05. september 2005 - 10:17 #4
det kan det godt være. prøve at placere teksten i center også så burde det virke..
Avatar billede jokkejensen Novice
05. september 2005 - 10:22 #5
Det er fordi dine layers er absolut positioneret..

Du kan ikke som det eksempel du har sendt
<div id="Layer1" style="position:absolute; left:62px; top:286px; width:235px; height:261px; z-index:1">

Her siger du det lag SKAL ligge 268px fra toppen og 62px fra venstre, så kan du ikke bagefter sige den skal ligge sig relativt centreret på siden..

Derfor skal du have fjernet alle left: og top: og have ændret dem alle til position:relative , eller bare slette position..

Dreamweaver er god til at bruge CSS filer, hvorfor gør du det ikke ? Det betyder nu for dig at du skal rette x antal filer for fejl, hvor du ellers kunne have gjort det i et..

Mvh
Avatar billede humpfrey Nybegynder
05. september 2005 - 14:06 #6
i dreamweaver kan du vælge mellem design visning og kodevisning
hvis du går over i designvisning, og markerer det hele, og nede i bunden vælger "centrer" så sætter dreamweaver selv koden ind div align canter, meeen som jokkejensen skriver er layer position absolute, et direktiv at det layer skal befinde sig,det du skriver i koden i forhold til øverste vensre hjørne, som han skriver, prøv med relative. Udover det kan du kigge i www.w3schools.com under css efter hvordan du laver dit layer med overflow:hidden, så du undgår at teksten hænger nedenunder....
stikord til googlesøgning:
div container
Avatar billede olebole Juniormester
05. september 2005 - 17:19 #7
<ole>

Allerførst skal du have enabled CSS i IE. Den DTD, du anvender, disabler store og ekstremt vigtige dele af CSS i Explorer. Prøv denne i stedet:
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

- så kan IE bl.a. også tolke CSS' box-model. Det gør muligvis, at dine sider ser lidt sære ud i IE - men det er fordi, din CSS er forkert. Når den er rettet, ser dine sider mere ens ud i de forskellige browsere  :)

Det er en rigtig skidt idé at bruge absolut positionering til grund-layout ... og iøvrigt helt unødvendigt. Elementer, der ikke er absolut positioneret, centreres horisontalt med:
  <ELEMENT style="margin:0 auto"> ... </ELEMENT>

/mvh
</bole>
Avatar billede olebole Juniormester
05. september 2005 - 17:26 #8
- så kan du i øvrigt altid skrive:

<div style="position:relative;width:500px;height:800px;border:1px solid red;margin:0 auto">
    <div style="position:absolute;left:20px;top:50px;padding:10px;background-color:yellow;">Blablabla</div>
</div>

Læg mærke til, hvordan det gule div placerer sig i forhold til det første, omkransende element, der også er positioneret (så er det ligegyldigt, om det er absolut eller relativt).

Det er _kun_, når et sådan element ikke kan findes, det absolut positionerede element vil placere sig i forhold til body'en  ;o)
Avatar billede humpfrey Nybegynder
05. september 2005 - 17:29 #9
ja og lige en hilsen til olebole-> vinen er købt, så du siger bare til hvornår jeg skal kigge forbi
Avatar billede ekfeldt_net Nybegynder
06. september 2005 - 16:57 #10
Tak skal i have folkens!

Problemet var rigtigt nok: "position:absolute" - med mere.
Efter at have forsøgt at arbejde med relative positioner i Dreamweaver måtte jeg opgive og gå over i Notepad... Hvilket ikke var så dum en idé - det har givet mig mindre filer, et bedre overblik og bedst af alt noget der virker.

Lidt googlesøgning på: "div container" sendte mig videre til:
http://www.quirksmode.org/css/centering.html
Som er meget pædagogisk for en ikke-HTML-haj.

mvh
Avatar billede humpfrey Nybegynder
06. september 2005 - 17:05 #11
takker for point - og godt at du fik det til at spille :)
Avatar billede olebole Juniormester
08. september 2005 - 07:44 #12
humpie >> jeg har lige noget vrøvl med min PSU. Så snart jeg er 'hjemme' på min laptop, mailer jeg dig  ;o)
Avatar billede 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.

Loading billede Opret Preview
Kategori
Kurser inden for grundlæggende programmering

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