/ 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
centrering af div med 3 kolonner og fast b~
Fra : Paul S


Dato : 14-09-08 22:03


Hej
Jeg prøver at få lave en skabelon til en side med fast bredde,
der er centeret. Headeren sidder fint centreret og footeren
ligeså, men jeg kan ikke få de 3 kolonner til at sidde centreret

eks.
http://jazo.dk/CenterTop.htm

Håber der er en, der kan se hvad jeg gør galt

/Paul S

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
Martin (15-09-2008)
Kommentar
Fra : Martin


Dato : 15-09-08 00:23

Paul S wrote:
> Hej
> Jeg prøver at få lave en skabelon til en side med fast bredde,
> der er centeret. Headeren sidder fint centreret og footeren
> ligeså, men jeg kan ikke få de 3 kolonner til at sidde centreret
>
> eks.
> http://jazo.dk/CenterTop.htm
>
> Håber der er en, der kan se hvad jeg gør galt

Fjern display:inline; i #container, det skulle gøre tricket.

For at få IE til at opføre sig som forventet, så vil jeg råde dig til at
lave et specifikt IE stylesheet, og hente det med conditional comments*,
som det så fint hedder

<!--[if lt IE 7]>
<style type="text/javascript">
</style>
<![endif]-->

Alt det der med at lave stjernehacks og alle de andre IE hacks, gør et
stylesheet uoverskuligt imo.

PS
En div er ALTID 100% bred af sin forældre, så du behøver ikke at skrive
width:900px i din #header

Dine position:relative, er ikke særlig nyttige før man begynder at bruge
position:absolute

* <http://hintzmann.dk/articles/skjulecss/conditionalcomments/>

Paul S (15-09-2008)
Kommentar
Fra : Paul S


Dato : 15-09-08 11:51

Martin wrote in dk.edb.internet.webdesign.html:
> Paul S wrote:
> > Hej
> > Jeg prøver at få lave en skabelon til en side med fast bredde,
> > der er centeret. Headeren sidder fint centreret og footeren
> > ligeså, men jeg kan ikke få de 3 kolonner til at sidde centreret
> >
> > eks.
> > http://jazo.dk/CenterTop.htm
> >
> > Håber der er en, der kan se hvad jeg gør galt
>
> Fjern display:inline; i #container, det skulle gøre tricket.
>
> For at få IE til at opføre sig som forventet, så vil jeg råde dig til at
> lave et specifikt IE stylesheet, og hente det med conditional comments*,
> som det så fint hedder
>
> <!--[if lt IE 7]>
&gt; <style type="text/javascript">
&gt; </style>
&gt; <![endif]-->
>
> Alt det der med at lave stjernehacks og alle de andre IE hacks, gør et
> stylesheet uoverskuligt imo.
>
> PS
> En div er ALTID 100% bred af sin forældre, så du behøver ikke at skrive
> width:900px i din #header
>
> Dine position:relative, er ikke særlig nyttige før man begynder at bruge
> position:absolute
>
> * <http://hintzmann.dk/articles/skjulecss/conditionalcomments/>

Det var lige det, Martin. Tak for hjælpen

Hvis jeg skulle finde på at fjerne filen jeg referer er her slut resultatet

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

<html>
<head>
<title>Centrer header</title>
<style type="text/css">
body{
   margin:0;
   padding:0;
width:100%;
text-align:center;
color:#000000;
font:11px tahoma, arial, verdana;
   background:#b5a194 url(images/bg.gif) repeat-y center;
}
#container
{
width:900px;
margin:0 auto 0 auto;
text-align:left;
}
#header
{
background-color:#957966;
border-bottom:1px solid #ffffff;
}
#leftRail{
   width:163px;
   background-color:#ff1111;
   float:left;
}
#center
{
   float:left;
   width:565px;
}
#rightRail{
   float:left;
   width:172px;
   background-color:#1111ff;
}
#footer{
   width:900px;
   clear:both;
   background-color:#ddd;
}
</style>
</head>
<body>
   <div id="container">
    <div id="header">
         <h2>Header</h2>
    </div>
   
      <div id="leftRail">
         <h2>Left</h2>
      </div>
      
      <div id="center">
         <h2>Content</h2>
      </div>
      <div id="rightRail">
         <h2>right</h2>
      </div>
   <div id="footer">This is the footer</div>
   </div>
</body>
</html>





--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Paul S (15-09-2008)
Kommentar
Fra : Paul S


Dato : 15-09-08 20:28

Martin wrote in dk.edb.internet.webdesign.html:
> Paul S wrote:
> > Hej
> > Jeg prøver at få lave en skabelon til en side med fast bredde,
> > der er centeret. Headeren sidder fint centreret og footeren
> > ligeså, men jeg kan ikke få de 3 kolonner til at sidde centreret
> >
> > eks.
> > http://jazo.dk/CenterTop.htm
> >
> > Håber der er en, der kan se hvad jeg gør galt
>
> Fjern display:inline; i #container, det skulle gøre tricket.
>
> For at få IE til at opføre sig som forventet, så vil jeg råde dig til at
> lave et specifikt IE stylesheet, og hente det med conditional comments*,
> som det så fint hedder
>
> <!--[if lt IE 7]>
&gt; <style type="text/javascript">
&gt; </style>
&gt; <![endif]-->
>
> Alt det der med at lave stjernehacks og alle de andre IE hacks, gør et
> stylesheet uoverskuligt imo.
>
> PS
> En div er ALTID 100% bred af sin forældre, så du behøver ikke at skrive
> width:900px i din #header
>
> Dine position:relative, er ikke særlig nyttige før man begynder at bruge
> position:absolute
>
> * <http://hintzmann.dk/articles/skjulecss/conditionalcomments/>


Hvis man trækker i browserens højre kant vises en tynd hvid margin til højre
alt efter hvor meget man trækker i den. Hvordan undgår man det ?

mvh
Paul S

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Birgit Holme (15-09-2008)
Kommentar
Fra : Birgit Holme


Dato : 15-09-08 01:10

Har du prøvet at fjerne "text-align:left;"

Den kan muligvis være synderen - har ikke testet det!

/Birgit


#container
{
width:900px;
margin:0 auto 0 auto;
   display:inline; /* So IE plays nice */
text-align:left;
position:relative; /* sæt referencenul i #side */
}

Paul S wrote in dk.edb.internet.webdesign.html:
> Hej
> Jeg prøver at få lave en skabelon til en side med fast bredde,
> der er centeret. Headeren sidder fint centreret og footeren
> ligeså, men jeg kan ikke få de 3 kolonner til at sidde
centreret
>
> eks.
> http://jazo.dk/CenterTop.htm
>
> Håber der er en, der kan se hvad jeg gør galt
>
> /Paul S
>
> --
> Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
> - Pædagogiske tutorials på dansk
> - Kom godt i gang med koderne
> KLIK HER! => http://www.html.dk/tutorials


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Søg
Reklame
Statistik
Spørgsmål : 177558
Tips : 31968
Nyheder : 719565
Indlæg : 6408924
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste