login  Naam:   Wachtwoord: 
Registreer je!
 Forum

2 div boxen naast elkaar, en het geheel centeren? (Opgelost)

Offline rolandt - 19/01/2009 00:55 (laatste wijziging 19/01/2009 00:56)
Avatar van rolandtNieuw lid
html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <div class="event">
  2. 	<ul>
  3. 		<li>onderwerp 1</li>
  4. 		<li>onderwerp 2</li>
  5. 		<li>onderwerp 3</li>
  6. 	</ul>
  7. </div><!-- einde event -->
  8.  
  9. <div class="event">
  10. 	<ul>
  11. 		<li>>onderwerp 1</li>
  12. 		<li>onderwerp 2</li>
  13. 		<li>onderwerp 3</li>
  14. 	</ul>
  15. </div><!-- einde event -->

html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. div.event {
  2. 	text-align:center;
  3. 	float:left;
  4. 	}


Dit stukje is een code uit een groter geheel. Hierin worden 2 div boxen links naast elkaar gezet. Het geheel wil ik gecentreerd hebben. En dat laatste wil maar niet lukken.

Met de html code <center> lukt het niet. En een extra div box maken (waar css text-align:center; wordt meegegeven) waarvan de 2 div boxen een onderdeel van zijn, lukt ook al niet. Misschien heb ik even een black out. Maar ik kom er nu even niet uit.
Hoe los ik dit op?

Grt,
Roland.

5 antwoorden

Gesponsorde links
Offline Ontani - 19/01/2009 00:59
Avatar van Ontani Gouden medailleGouden medailleGouden medailleGouden medaille

-1		 je gaat die dingen enkel kunnen centreren als je een breedte voor je div gaat bepalen.

bijvoorbeeld:
css code - Bekijk de code zonder highlighting - Klap code in 
  1. .event {
  2.  width: 500px;
  3.  margin-left: auto;
  4.  margin-right: auto;
  5. }
Offline rolandt - 19/01/2009 02:00
Avatar van rolandt Nieuw lid Op zich wordt het nu gecentreerd. Alleen de beide div boxen komen nu weer onder elkaar te staan i.p.v. naast elkaar.

Grt,
Roland.
Offline zointer - 19/01/2009 06:18
Avatar van zointer HTML gevorderde
rolandt schreef:
Op zich wordt het nu gecentreerd. Alleen de beide div boxen komen nu weer onder elkaar te staan i.p.v. naast elkaar.

Grt,
Roland.

Jouw code zal de div nooit naast elkaar brengen omdat ze geen width hebben, doe zoals Ontani zegt of zo;
css code - Bekijk de code zonder highlighting - Klap code in 
  1. #container{
  2.      margin:auto;
  3.      width:1000px;
  4. }
  5. .event {
  6.     text-align:center;
  7.     float:left;
  8.     width: 500px;
  9. }

html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <div id="container">
  2.  <div class="event">
  3.      <ul>
  4.          <li>onderwerp 1</li>
  5.          <li>onderwerp 2</li>
  6.          <li>onderwerp 3</li>
  7.      </ul>
  8.  </div><!-- einde event -->
  9.  
  10.  <div class="event">
  11.      <ul>
  12.          <li>>onderwerp 1</li>
  13.          <li>onderwerp 2</li>
  14.          <li>onderwerp 3</li>
  15.      </ul>
  16.  </div><!-- einde event -->
  17. </div>
Offline masters86 - 19/01/2009 13:13
Avatar van masters86 Nieuw lid .event {
display:inline;
}
Offline rolandt - 22/01/2009 21:52
Avatar van rolandt Nieuw lid Iedereen bedankt voor het mee denken en het oplossen.

Grt,
Roland.
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.292s