Centrering i CSS spalter

Hej alle,

Er der nogen der ved, hvordan jeg centrerer teksten i (3) spalter, så teksten forbliver centreret og horisontal?

Jeg har følgende i min css-kode:

#spalte1 {
width: 33%;
}
#spalte2 {
width: 33%;
}
#spalte3 {
width: 33%;
}

og følgende i min html-kode:

<div id="spalte1">
blablablabla 
</div>
<div id="spalte2">
blablablabla
</div>
<div id="spalte3">
blablablabla
</div>
<p class="flydestop">
</p>

Jeg har prøvet med text-align:center; men synes ikke, at det virker...

På forhånd tak.

/JG

 

Hej Allan,

Tak for svar. Tilgiv mig for værende CSS-nul, men såvidt jeg forstår, drejer tråden du henviser til sig om positionering af hele siden vha. en wrapper - right?

Det jeg konkret er på udkig efter, er en opdeling af 3 tekster i 3 elementer med dertilhørende centrering. (det er på siden http://www.starflexcolchoes.com/ hvor der i menu-baren er 3 navne (Maranhão Pará Tocantins, som jeg ønsker skal stå i centrum af hver deres spalte/element)

Igen tilgiv mig, hvis jeg ikke kan se sammenhængen mellem wrapperen og ovenstående.

/JG

JesperG:

Hej Allan,

Tak for svar. Tilgiv mig for værende CSS-nul, men såvidt jeg forstår, drejer tråden du henviser til sig om positionering af hele siden vha. en wrapper - right?

Det jeg konkret er på udkig efter, er en opdeling af 3 tekster i 3 elementer med dertilhørende centrering. (det er på siden http://www.starflexcolchoes.com/ hvor der i menu-baren er 3 navne (Maranhão Pará Tocantins, som jeg ønsker skal stå i centrum af hver deres spalte/element)

Igen tilgiv mig, hvis jeg ikke kan se sammenhængen mellem wrapperen og ovenstående.

/JG

I siden du henviser til er text-align sat til left. Andrer jeg den til center ser de rimelig centreret ud i min browser. 

JesperG:

Tak for svar. Tilgiv mig for værende CSS-nul, men såvidt jeg forstår, drejer tråden du henviser til sig om positionering af hele siden vha. en wrapper - right?

Problemet her er at text-align: center; bliver ugyldig når man floater left...

Er det dette her du er efter ?

Med menuer vil jeg anbefale dig at bruge class da disse kan genbruges ....

Løsningen her er:

display:inline-block;

Så i din kode vil dette betyde :

Html:

<div id="menu">
<div class="spalte1"><h3>Maranhão</h3> </div>
<div class="spalte1"><h3>Pará</h3></div>
<div class="spalte1"><h3>Tocantins</h3></div>
</div>

CSS:

#menu {
width: 770px;
background: #ff8e28 url(images/menu.jpg) no-repeat;
height: 40px;
line-height: 40px;
padding-left: 10px;
margin: 0;
font-weight: bold;
text-align: left;
color:#000;

}
.spalte1 {
    text-align: center;   
    width:  32%;
    display:inline-block;
   
}

Håber det kan bruges ...

/allan

Hej Allan,

Det er præcis hvad jeg søger - tak for et super-kompetent svar.

/JG