Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS]Wyrównywanie elementów listy
szczabik
post
Post #1





Grupa: Zarejestrowani
Postów: 226
Pomógł: 1
Dołączył: 13.05.2008

Ostrzeżenie: (0%)
-----

Witam mam taki kod
[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <style type='text/css'>
  4. .list, ul li  {
  5. display: block;
  6. list-style: none;
  7. margin: 0;
  8. padding: 0;
  9. }
  10.  
  11. .list li, .list_span {
  12. text-align:right;
  13. }
  14.  
  15. .list li, a {
  16. text-align:left;
  17. }
  18.  
  19.  
  20.  
  21. </style>
  22. </head>
  23. <body>
  24. <ul class='list'>
  25. <li><a href="#">Temat 1</a><span class='list_span'>12</span></li>
  26. <li><a href="#">Temat 2</a><span class='list_span'>12</span></li>
  27. <li><a href="#">Temat 3</a><span class='list_span'>32</span></li>
  28. <li><a href="#">Temat 4</a><span class='list_span'>42</span></li>
  29. <li><a href="#">Temat 5</a><span class='list_span'>12</span></li>
  30. </ul>
  31. </body>
  32. </html>
[HTML] pobierz, plaintext

I chciał bym zrobić by linki były wyrównane do lewej strony a tekst w <span> do prawej próbowałem z float text-align ale nie przyniosło to oczekiwanego efektu proszę o pomoc.

Ten post edytował szczabik 15.08.2010, 18:23:56
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
arzach
post
Post #2





Grupa: Zarejestrowani
Postów: 332
Pomógł: 6
Dołączył: 27.11.2008

Ostrzeżenie: (0%)
-----

Zrobiłem tak i 
[CSS] pobierz, plaintext 
  1. .list, ul li  {
  2. display: block;
  3. list-style: none;
  4. margin: 0;
  5. padding: 0;
  6. }
  7.  
  8. .list li {
  9. clear:both;
  10. }
  11.  
  12. .list a {
  13. float:left;
  14. }
  15.  
  16. .list span {
  17. clear:right;
  18. }
[CSS] pobierz, plaintext

Wszystko jest teraz z lewej strony.
(IMG:http://images49.fotosik.pl/326/f90a9277c2e45809.jpg)

Kod, który podał Ramzaa nie działa.


Cytat(Mostrom @ 15.08.2010, 20:18:20 ) *
1 metoda: zrób obok drugą listę, w której będą się znajdować elementy z prawej storny
2 metoda: umieść dane w tabeli

Tak w ogóle to nie wierzę, że nie działa (IMG:style_emoticons/default/biggrin.gif)


Robiłem to wcześniej w tabelkach, ale tabele są przestarzałe i postanowiłem to zrobić w formie listy.

Czyli jednym rozwiązaniem jest zmiana span na div ?
Go to the top of the page
+Quote Post
Damonsson
post
Post #3





Grupa: Zarejestrowani
Postów: 2 355
Pomógł: 533
Dołączył: 15.01.2010
Skąd: Bydgoszcz

Ostrzeżenie: (0%)
-----

Cytat(arzach @ 15.08.2010, 20:35:02 ) *
Kod, który podał Ramzaa nie działa.


Robiłem to wcześniej w tabelkach, ale tabele są przestarzałe i postanowiłem to zrobić w formie listy.

Czyli jednym rozwiązaniem jest zmiana span na div ?


1. Bo nie ma prawa działać (IMG:style_emoticons/default/winksmiley.jpg)
2. Nie, rozwiązanie masz jeden post nad Twoim (IMG:style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post

Posty w temacie
- szczabik   [CSS]Wyrównywanie elementów listy   15.08.2010, 18:22:09
- - Damonsson   [CSS] pobierz, plaintext .list, ul li {displ...   15.08.2010, 19:01:32
- - arzach   To nic nie dało. Tak robiłem już wcześniej teraz w...   15.08.2010, 19:12:07
- - Mostrom   1 metoda: zrób obok drugą listę, w której będą się...   15.08.2010, 19:18:20
- - Pawel_W   dla li daj clear:both   15.08.2010, 19:18:23
- - Ramzaa   [CSS] pobierz, plaintext .list, ul li {displ...   15.08.2010, 19:18:27
- - Mostrom   Jeszcze jedno: ze span są same problemy. Spróbuj t...   15.08.2010, 19:22:28
|- - Pawel_W   Cytat(Mostrom @ 15.08.2010, 20:22:28 ...   15.08.2010, 19:27:16
- - Mostrom   to w takim razie po co wyrównanie tekstu w liście ...   15.08.2010, 19:34:18
- - Damonsson   Ooops, tamto tylko sprawdziłem pod IE6 Tamto moż...   15.08.2010, 19:34:55
- - arzach   Zrobiłem tak i [CSS] pobierz, plaintext .list, ul...   15.08.2010, 19:35:02
|- - Damonsson   Cytat(arzach @ 15.08.2010, 20:35:02 )...   15.08.2010, 19:38:57
|- - arzach   Cytat(Damonsson @ 15.08.2010, 20:38:5...   15.08.2010, 19:43:45
|- - Pawel_W   Cytat(arzach @ 15.08.2010, 20:43:45 )...   15.08.2010, 19:46:14
- - Pawel_W   ustaw temu spanowi po prostu display: block; a dl...   15.08.2010, 19:40:42
- - Damonsson   Ty baranie, a może tak przepiszesz dokładnie to co...   15.08.2010, 19:49:06
- - darophp   Spokojnie @Damonsson ... już w n-tym wątku się den...   15.08.2010, 20:19:53
- - arzach   Sorki jednak działa złe skopiowałem, bo robiłem wc...   15.08.2010, 20:20:14
- - Pawel_W   tylko po co tyle postów? o dodaniu clear: both do ...   15.08.2010, 21:12:11

« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 5.04.2026 - 07:05
Powered By IP.Board © 2026  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn