Tekst naar links of rechts centreren?

Status
Niet open voor verdere reacties.

IkHebEenVraag00

Gebruiker
Lid geworden
27 mei 2013
Berichten
98
Hallo allemaal,

Mijn probleem is: Als ik tekst op mijn website plaats dan staat het niet allemaal netjes in het midden gecentreerd naar de linkerkant, dus zoals dit:

Hallo
Dit staat aan
De Linkerkant


Lange zinnen staan meer naar links dan korte. Mijn vraag is dus: Hoe kun je zorgen dat ze allemaal gecentreerd en verticaal aan de linkerkant op een rij staan van de website?


Alvast bedankt! :thumb:
 
Laatst bewerkt:
werkt je met css files

zoja werk dan met divs


<div id="tekst1">

Hallo
Dit staat aan
De Linkerkant
</div>

in je css file kun je de div een maat aan geven en waar hij hem neer moet zetten

#main {
margin-top: 200px;
margin: 0 auto;
width: 800px;
height: 1000px;
padding: 10px;
}

margintop geeft aan hover hij van de boven kant af moet


optie is margin left hoever hij uit de linker kant moet

width is de breedte van de div
height in de hoogte
d zo kun je text oonog i n grote kleur aan passen center doen we niet meer aan in html 5
 
Ik krijg met de
<div id="tekst1">

Hallo
Dit staat aan
De Linkerkant
</div>

Het volgende beeld:

Help HTML.jpg


Ik wil dus graag dat het in het midden van dat kader zit en allemaal zoals:

Hallo
Dit staat aan
De Linkerkant
 
Hoe uiteindelijk? Voor het archief...

Sorry, ik wilde nog de oplossing achterlaten, maar dacht dat het overbodig was, maar dit was de oplossing:

<left>



<div id="tekst1">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href="http://runecraft-server.webs.com/apps/auth/login?try=1&next="><img src="http://i41.tinypic.com/w1snee.jpg"
onmouseover="this.src='http://i43.tinypic.com/2jbjwub.jpg'"
onmouseout="this.src='http://i41.tinypic.com/w1snee.jpg'" />
</A>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="http://runecraft-server.webs.com/apps/auth/signup"><img src="http://i42.tinypic.com/33dcrxx.png"
onmouseover="this.src='http://i42.tinypic.com/2isb047.png'"
onmouseout="this.src='http://i42.tinypic.com/33dcrxx.png'" /></A>
</span>
</div>


</left>

Simpelweg heb ik dus telkens &nbsp; gedaan om de tekst in het midden te krijgen ;)
 
zo schrijf niet helemaal weg
<div id="tekst1">
bla bla linkje linkje </div

o m dat ik de div naam tekst 1 mee gegeven heb
kun je in je style (css pagina )

de div spreek je dan zo aan

#tekst1 {
weight:200px;
height: 200px;
padding-top:50px;
padding-left:50px;
}

als meer naar recht wil moet grote maat op geven bij padding left
on gekeerde voor de top
grote van de dibv kun je bepalen door wieght heigt de px in ander getal in te voeren

tip zo kun je ook een div i div plaatsen en daar weer wat anders in plaatsen
 
<left> en </left> is geen html...
Heeeeeeel veel spaties ( &nbsp; ) lijkt mij geen prettige html leesbaarheid.
Als je geen css stylesheet gebruikt, doe de style dan in je html (niet netjes, maar beter dan al die spaties)
Code:
<div id="tekst1">

<span style="margin-left:40px;">
<a href="http://runecraft-server.webs.com/apps/auth/login?try=1&next=">
<img src="http://i41.tinypic.com/w1snee.jpg" 
 onmouseover="this.src='http://i43.tinypic.com/2jbjwub.jpg'"
 onmouseout="this.src='http://i41.tinypic.com/w1snee.jpg'" /></a>
</span>

<span style="margin-left:40px;">
<a href="http://runecraft-server.webs.com/apps/auth/signup">
<img src="http://i42.tinypic.com/33dcrxx.png" 
 onmouseover="this.src='http://i42.tinypic.com/2isb047.png'"
 onmouseout="this.src='http://i42.tinypic.com/33dcrxx.png'" /></a>
</span>

</div>
 
@Bron, bedankt voor de code. Ik vond het zelf ook nogal rommelig staan, maar ik vond geen andere opties dan deze. Bedankt voor de moeite! :thumb:
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan