login  Naam:   Wachtwoord: 
Registreer je!
 Forum

div's langs elkaar + uitrekken (Opgelost)

Offline Raze - 26/07/2010 16:45
Avatar van RazePHP beginner Hallo,

ik heb het volgende probleem: zie afbeelding http://i27.tinypic.com/2na7joy.jpg

ik wil dus dat in die div met de rode rand, de groene en de blauwe mooi langs elkaar blijven. Asl er ééntje groter wordt (langer), dan moet de div met de rode rand ook naar beneden gaan.

Dit is mijn CSS-code:
  1. div#container {
  2. position: relative;
  3. left: 10%;
  4. width: 80%;
  5. border: 1px solid red;
  6. }
  7.  
  8. div#container div#content {
  9. position: relative;
  10. top: 0%;
  11. left: 0%;
  12. width: 65%;
  13. background: green;
  14. }
  15.  
  16. div#container div#userbar {
  17. position: absolute;
  18. top: 0%;
  19. left: 70%;
  20. width: 15%;
  21. background: blue;
  22. }


maar deze code is dus fout (zie afbeelding wat er fout loopt).

Iemand een idee?

2 antwoorden

Gesponsorde links
Offline Ewergreen - 26/07/2010 17:27 (laatste wijziging 26/07/2010 17:28)
Avatar van Ewergreen Nieuw lid Hoi Raze,

Op zich niet zo moeilijk, maar er zaten een paar foutjes in uw uitgangspunt volgens mij. Ik heb dus één en ander aangepast. Ik geloof dat je nog een paar kleine zaken zult moeten aanpassen, maar dat je hiermee verder kunt. Moest er nog een probleem zijn, dan horen we het wel.

Succes

Wouter

  1. #container {
  2. width: 80%;
  3. height: auto;
  4. position: relative;
  5. left: 50%;
  6. margin-left: -480px;
  7. overflow: hidden;
  8. border: 1px solid red;
  9. }
  10. #content {
  11. width: 85%;
  12. height: auto;
  13. float: left;
  14. background: green;
  15.  
  16. }
  17. #userbar {
  18. width: 15%;
  19. height: auto;
  20. float: left;
  21. background: blue;
  22. }
Bedankt door: Raze
Offline Raze - 26/07/2010 22:17
Avatar van Raze PHP beginner ok dat probleem is al opgelost.

Nu het volgende:

zie afbeelding: http://i30.tinypic.com/hwmkqp.jpg

het gaat om één regel code:

  1. html,body { font-family: "lucida grande",tahoma,verdana,arial,sans-serif; font-size: 11px; background: #f9f9f9; }


staat er die code in, is het niét op één lijn. Staat er die code niet in, dan is het wél netjes op één lijn.

Hier de rest van mijn CSS-code:

  1. div#footer div#footerContent {
  2. padding: 3px;
  3. }
  4. ul li.popOpen { list-style: none; color: #5a7ea2; cursor: default; padding: 4px; float: left; }
  5.  
  6. ul li.popOpen div.popOpencontent {
  7. position: absolute;
  8. bottom: 100%;
  9. border: 1px solid #cccccc;
  10. border-bottom: 2px solid #ebebeb;
  11. background: #ebebeb;
  12. padding: 5px;
  13. width: auto;
  14. height: auto;
  15. display: none;
  16. }
  17.  
  18. ul li.popOpen:hover div.popOpencontent {
  19. display: block;
  20. }
  21.  
  22. div.popOpen:hover div.popOpencontent:hover {
  23. display: block;
  24. }
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.183s