[xhtml / css] dziwny problem linkow w div`ach...

[dominiq]

Witam.

Walczylem wczorak pol dnia, ale niestety nie znalazlem rozwiazania...
Do rzeczy:


Cały problem polega na tym, że kiedy <li> "recentcomments" wypelniony jest samym linkiem (<a>) wszystko gra, natomiast kiedy dodam przed lub za linkiem jakis text <li> dzielone jest na dwie linie... wie ktos moze w czym problem?

plik css:

Kod: Zaznacz cały

body
	{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	background-image: url(gfx/bg.gif);
	padding: 0px;
	margin: 0px;
	}

#recentcomments {
	clear: both;
	}

#recentcomments ul {
	list-style: none;
	margin:0 0 10px 0;
	padding: 0;
	}
	
#recentcomments ul li
	{
	display: inline;
	}
	
#recentcomments ul li a
	{
	border-bottom: 1px solid #d1d1d1;
	cursor: pointer;
	display: block;
	text-decoration: none !important;
	margin: 0px;
	padding-top: 4px;
	padding-right: 0px;
	padding-bottom: 4px;
	padding-left: 0px;
	color: #135193;
	}

#recentcomments ul li:hover {
	background: #f9f9f9;
	border-bottom-color: #C3B9A2;
}

plik htm blednie wyswietlajacy wynik:

Kod: Zaznacz cały

<div id="recentcomments">
	<h4>Ostatnie komentarze</h4>
        <ul>
        <li>03.01.2007, dominiq, <a href="linkdokomentarza.php">komentarz</a></li>
        </ul>
</div>

i plik htm poprawnie wyswietlajacy wynik:

Kod: Zaznacz cały

<div id="recentcomments">
	<h4>Ostatnie komentarze</h4>
        <ul>
        <li><a href="linkdokomentarza.php">komentarz - drugie slowo</a></li>
        </ul>
</div>

Pozdrawiam.
Dominiq

[koziolek]

Kod: Zaznacz cały

#recentcomments ul li a
   {
...
   display: block;
....
   } 

linki są blokowe więc zawsze zjadą. można to zmienić dodając im klasę. floatowanie nic nie da bo słowo może być przed (wtedy float: right) lub za (float: left) linkiem więc i tak trzeba by było dołożyć klasy które by to ustawiały.

Kod: Zaznacz cały

<li>03.01.2007, dominiq, <a class="inline" href="linkdokomentarza.php">komentarz</a></li> 

css:

Kod: Zaznacz cały

#recentcomments ul li a.inline{display: inline}