login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Fout met float

Offline tomie94 - 24/11/2007 13:35
Avatar van tomie94PHP interesse Hallo,

Ben bezig met m'n layout...

En ik heb nu deze CSS Code:
  1. .info
  2. {
  3. background: url(afbeeldingen/info.gif);
  4. width: 600px;
  5. min-height: 200px;
  6. height: 0 auto;
  7. }
  8. .titel_infor
  9. {
  10. background: url(afbeeldingen/titel_info.gif);
  11. width: 200px;
  12. height: 45px;
  13. float: right;
  14. }
  15. .titel_infol
  16. {
  17. background: url(afbeeldingen/titel_info.gif);
  18. width: 200px;
  19. height: 45px;
  20. float: left;
  21. }
  22. .content_infol
  23. {
  24.  
  25. width: 200px;
  26. min-height: 100px;
  27. height: 0 auto;
  28. float: left;
  29. }
  30. .content_infor
  31. {
  32.  
  33. width: 200px;
  34. min-height: 100px;
  35. height: 0 auto;
  36. float: right;
  37. }

maar nu staat de tekst(content_infol) op de verkeerde plek...
Srceenshot: http://img125.i...125hj6.gif

3 antwoorden

Gesponsorde links
Offline Clemens32 - 24/11/2007 13:43
Avatar van Clemens32 PHP interesse als je float: left gebruikt bij het ene, moet je de andere, die er tegenaan moet komen, ook left floaten.
Ik kan niet erg veel wijs uit je css, omdat ik er geen html bij heb.
Zou het kunnen dat je ergens een clear: both moet hebben staan?
Offline tomie94 - 24/11/2007 13:52 (laatste wijziging 27/11/2007 18:41)
Avatar van tomie94 PHP interesse nee hij moet er niet tegenaan komen maar de een moet links staan en de ander moet rechts....

HTML:
  1. <div class="info">
  2. <div class="titel_infol">
  3. </div>
  4. <div class="content_infol">
  5. <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse auctor, mauris eu feugiat mollis, dolor urna rutrum massa, in facilisis nisi tortor quis felis. Morbi aliquam ornare ante. Donec cursus nulla quis mi. Donec tincidunt. Aliquam erat volutpat. Praesent sit amet nunc. Nam id nulla. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec in mauris non odio vestibulum euismod. Sed ac arcu. Aliquam lobortis lectus at lorem. Pellentesque aliquet hendrerit ipsum. Nunc ac urna et mauris dapibus fermentum. Suspendisse libero. Vivamus non dui. Ut eu sem a mi placerat eleifend. Aliquam libero. Proin eu eros a enim laoreet ultricies.
  6.  
  7. Vivamus rhoncus scelerisque dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec nulla urna, nonummy id, aliquam a, ornare sed, metus. Donec ut est. Integer porta nisi non nunc. Nunc dignissim mi in lectus. Maecenas sollicitudin tortor in dui. Phasellus semper. In sapien elit, porta sed, iaculis eu, nonummy sed, erat. Nullam suscipit, tellus non rutrum dignissim, sapien nisi dictum mauris, eget scelerisque velit risus id elit. Vestibulum auctor gravida nibh. Donec id orci. Curabitur accumsan. Pellentesque libero nisl, mollis vitae, varius et, elementum in, ante. Aenean vitae leo. In non turpis. Sed lectus nisl.
  8. </p>
  9. </div>
  10. <div class="titel_infor">
  11. </div>
  12. <div class="content_infor"><p>
  13. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse auctor, mauris eu feugiat mollis, dolor urna rutrum massa, in facilisis nisi tortor quis felis. Morbi aliquam ornare ante. Donec cursus nulla quis mi. Donec tincidunt. Aliquam erat volutpat. Praesent sit amet nunc. Nam id nulla. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec in mauris non odio vestibulum euismod. Sed ac arcu. Aliquam lobortis lectus at lorem. Pellentesque aliquet hendrerit ipsum. Nunc ac urna et mauris dapibus fermentum. Suspendisse libero. Vivamus non dui. Ut eu sem a mi placerat eleifend. Aliquam libero. Proin eu eros a enim laoreet ultricies.
  14.  
  15. Vivamus rhoncus scelerisque dolor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec nulla urna, nonummy id, aliquam a, ornare sed, metus. Donec ut est. Integer porta nisi non nunc. Nunc dignissim mi in lectus. Maecenas sollicitudin tortor in dui. Phasellus semper. In sapien elit, porta sed, iaculis eu, nonummy sed, erat. Nullam suscipit, tellus non rutrum dignissim, sapien nisi dictum mauris, eget scelerisque velit risus id elit. Vestibulum auctor gravida nibh. Donec id orci. Curabitur accumsan. Pellentesque libero nisl, mollis vitae, varius et, elementum in, ante. Aenean vitae leo. In non turpis. Sed lectus nisl.
  16. </p>
  17. </div>
  18. </div>


Edit
clear: both
werkt ook niet

niemand?
Offline Vincjenzo - 28/11/2007 15:54 (laatste wijziging 28/11/2007 15:55)
Avatar van Vincjenzo Nieuw lid Begrijp niet 100% wat je wil bereiken maar..zoiets?

Plaatscode: 4214
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.171s