Witajcie, może mnie ktoś poratować, jak mam ułożyć divy (+ style do tego) oraz jakieś <p> (+ style do tego), abym mógł otrzymać coś takiego jak na obrazku.

Screen:


Z góry thx ;-)


@edit by in5ane:
Ogólnie chodzi mi o to, jak zrobić te linię.

To co zrobiłem:
  1. <div id="content">
  2. <div id="left-content">
  3. <img style="float: left;" src="images/aktualnosci.jpg" alt="" />
  4. <p style="padding-top: 25px;"><strong>Niedziala, 30 listopada</strong><br /><strong>Imieniny:</strong> Andrzeja i Jakuba oraz Jakub haha.gif</p>
  5. <p style="clear: both; text-align: justify;">W piątkowym meczu 17. kolejki Ekstraklasy Wisła Kraków pokonała Odrę Wodzisław 3:1 (0:0). Wszystkie bramki dla zespołu "Białej Gwiazdy" zdobył Rafał Boguski. Zwycięstwo pozwoliło krakowianom zrównać się punktami z liderującym Lechem Poznań. </p>
  6. </div>
  7. <div id="right-content">
  8. <img src="images/panel-uzytkownika-logowanie.jpg" alt="" />
  9. <p class="panel-uzytkownika">
  10. login: <input type="text" name="login" class="pole-form" /><br />
  11. hasło: <input type="text" name="haslo" class="pole-form" /><br />
  12. <strong>rejestracja</strong> | zapomniane hasło <img src="images/loguj.jpg" alt="" />
  13. </p>
  14. <img src="images/polecamy.jpg" alt="" />
  15. <p class="polecamy">Na obecny weekend brak ciekawych imprez.</p>
  16. <img src="images/reklama.jpg" alt="" />
  17. <p class="reklama">Chcesz wykupić reklamę na stronie? Napisz do nas.</p>
  18. <img src="images/wspolpraca.jpg" alt="" />
  19. <p class="wspolpraca">Chętne osoby/firmy do współpracy prosimy o kontakt.</p>
  20. </div>
  21. </div>


  1. #content {
  2. width: 880px;
  3. font-family: Verdana;
  4. font-size: 12px;
  5. color: #000000;
  6. margin: 15px;
  7. float: left;
  8. }
  9.  
  10. #left-content {
  11. width: 580px;
  12. float: left;
  13. }
  14.  
  15. #right-content {
  16. width: 290px;
  17. float: right;
  18. }
  19.  
  20. .panel-uzytkownika {
  21. margin-left: 5px;
  22. margin-bottom: 15px;
  23. padding-bottom: 5px;
  24. border-bottom: 1px dashed #c0c0c0;
  25. text-align: center;
  26. }
  27.  
  28. input.pole-form{
  29. background: url(images/pole-form.jpg) no-repeat;
  30. width: 169px;
  31. height: 18px;
  32. padding-left: 14px;
  33. padding-top: 1px;
  34. border: 0;
  35. margin-top: 3px;
  36. margin-left: 3px;
  37. }
  38.  
  39. .polecamy{
  40. margin-left: 5px;
  41. margin-bottom: 15px;
  42. padding-bottom: 5px;
  43. border-bottom: 1px dashed #c0c0c0;
  44. }
  45.  
  46. .reklama {
  47. margin-left: 5px;
  48. margin-bottom: 15px;
  49. padding-bottom: 5px;
  50. border-bottom: 1px dashed #c0c0c0;
  51. }
  52.  
  53. .wspolpraca {
  54. margin-left: 5px;
  55. margin-bottom: 15px;
  56. }


I jeszcze chodzi mi o to, żeby zrobić porządek z tym formularzem, tzn. jakoś ładnie to zrobić (równo) (w normalnym html'u można było na tabelkach, ale w xHTMLu nie wiem jak).

Adres: http://muay-thai.com.pl/dp/ (tutaj możecie zerknąć to co osiągnąłem + ten formularz.


Z góry dziękuję za pomoc.