Avatar billede jwulff Nybegynder
21. juni 2007 - 14:59 Der er 7 kommentarer og
1 løsning

Centrering af Div og div bokse inden i

Hej, jeg har nedenstående kode til at centrere en div boks, og det fungerer egentlig.

Problemet er at jeg har nogle andre div bokse der gerne skulle være i midten af den første div boks. Burde de ikke tage udgangspunkt i den første div boks? - ændrer jeg width i container flytter resten rigtig nok med. - Sættes den til 100% er alle de andre div bokse dog helt til venstre :(

#container {
        position: relative;
        text-align: center;
        width: 80%;
        margin-left: auto;
        margin-right: auto;
}

En af de andre div bokse

#window-bund_ {
    position:absolute;
    left:18px;
    top:685px;
    margin: 0 auto;
    width:721px;
    height:22px;
}

Håber i forstår og kan hjælpe.
Avatar billede horsmark Nybegynder
21. juni 2007 - 15:24 #1
url ?
Avatar billede jwulff Nybegynder
21. juni 2007 - 17:48 #2
Har ikke lige uploadet det.

Her er koden:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Titel</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">
<!--

body {

background-color: #29200f;
text-align: center;

}

#Table_01 {
    position:absolute;
    left:0px;
    top:0px;
    width:757px;
    height:750px;
}

#index-01_ {
    position:absolute;
    left:0px;
    top:0px;
    width:18px;
    height:750px;
}

#window-top_ {
    position:absolute;
    left:18px;
    top:0px;
    width:721px;
    height:31px;
}

#index-03_ {
    position:absolute;
    left:739px;
    top:0px;
    width:18px;
    height:750px;
}

#window-left_ {
    position:absolute;
    left:18px;
    top:31px;
    width:10px;
    height:654px;
}

#banner-top_ {
    position:absolute;
    left:28px;
    top:31px;
    width:698px;
    height:73px;
}

#window-right_ {
    position:absolute;
    left:726px;
    top:31px;
    width:13px;
    height:654px;
}

#index-07_ {
    position:absolute;
    left:28px;
    top:104px;
    width:168px;
    height:45px;
}

#btn-forside_ {
    position:absolute;
    left:196px;
    top:104px;
    width:108px;
    height:45px;
}

#btn-menukort_ {
    position:absolute;
    left:304px;
    top:104px;
    width:125px;
    height:45px;
}

#btn-kontakt_ {
    position:absolute;
    left:429px;
    top:104px;
    width:111px;
    height:45px;
}

#index-11_ {
    position:absolute;
    left:540px;
    top:104px;
    width:186px;
    height:45px;
}

#menu-bar_ {
    position:absolute;
    left:28px;
    top:149px;
    width:698px;
    height:100px;
    background-image: url('images/hoved_vindue_bg.jpg');
    background-repeat: repeat-y
}

#hoved-vindue_ {
    position:absolute;
    left:28px;
    top:158px;
    width:698px;
    height:527px;
    background-image: url('images/hoved_vindue_bg.jpg');
    background-repeat: repeat-y
}

#window-bund_ {
    position:absolute;
    left:18px;
    top:685px;
    margin: 0 auto;
    width:721px;
    height:22px;
}

#index-15_ {
    position:absolute;
        text-align: center;
    left:18px;
    top:707px;
    width:721px;
    height:43px;
}

#container {

        position: relative;
        text-align: center;
        width: 80%;
        margin-left: auto;
        margin-right: auto;

}

-->

</style>
</head>

<body>
<div id="container">
    <div id="index-01_">
        <img id="index_01" src="images/index_01.jpg" width="18" height="750" alt="" />
    </div>
    <div id="window-top_">
        <img id="window_top" src="images/window_top.jpg" width="721" height="31" alt="" />
    </div>
    <div id="index-03_">
        <img id="index_03" src="images/index_03.jpg" width="18" height="750" alt="" />
    </div>
    <div id="window-left_">
        <img id="window_left" src="images/window_left.jpg" width="10" height="654" alt="" />
    </div>
    <div id="banner-top_">
        <img id="banner_top" src="images/banner_top.jpg" width="698" height="73" alt="" />
    </div>
    <div id="window-right_">
        <img id="window_right" src="images/window_right.jpg" width="13" height="654" alt="" />
    </div>
    <div id="index-07_">
        <img id="index_07" src="images/index_07.jpg" width="168" height="45" alt="" />
    </div>
    <div id="btn-forside_">
        <a href="index.asp"><img id="btn_forside" src="images/btn_forside.gif" width="108" height="45" alt="Forside" border="0"/></a>
    </div>
    <div id="btn-menukort_">
        <a href="menukort.asp"><img id="btn_menukort" src="images/btn_menukort.jpg" width="125" height="45" alt="Menukort" border="0"/></a>
    </div>
    <div id="btn-kontakt_">
        <a href="kontakt.asp"><img id="btn_kontakt" src="images/btn_kontakt.jpg" width="111" height="45" alt="Kontakt" border="0"/></a>
    </div>
    <div id="index-11_">
        <img id="index_11" src="images/index_11.jpg" width="186" height="45" alt="" />
    </div>
    <div id="menu-bar_" valign="top">
        <img id="menu_bar" src="images/menu_bar.jpg" width="698" height="9" alt="" />
    </div>
    <div id="hoved-vindue_" align="left">
        asd
    </div>
    <div id="window-bund_">
        <img id="window_bund" src="images/window_bund.jpg" width="721" height="22" alt="" />
    </div>
    <div id="index-15_">
        <img id="index_15" src="images/index_15.jpg" width="721" height="43" alt="" />
    </div>
</div>

</body>
</html>
Avatar billede roenving Novice
22. juni 2007 - 01:45 #3
Klassisk eksempel på, at det zq ik' virker at smide kode, for hele siden er jo bare døde billede-links, når jeg ser den ...

-- men ellers kan det da bare sigs, at centrering laves med margin:auto; så din container-kode bør vel skrives:

#container {
  position: relative;
  width: 864px;
  margin: 0 auto;
}
Avatar billede jwulff Nybegynder
27. juni 2007 - 17:28 #4
Beklager, min skide godt... nu virker det ;)

Smit et svar.
Avatar billede roenving Novice
27. juni 2007 - 17:34 #5
Velbekomme '-)
Avatar billede thesurfer Nybegynder
27. juni 2007 - 17:37 #6
roenving> Hmm... Angående 22/06-2007 01:45:19:

Der er jo defineret højde og bredde på billederne.. så burde billederne vil optage samme areal, selv om de ikke findes..?
Avatar billede roenving Novice
27. juni 2007 - 18:03 #7
Ja, men gennemskueligheden er fraværende !-)
Avatar billede roenving Novice
06. august 2007 - 15:36 #8
Tak for point ;~}
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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