Wordpress: varför får jag radbrytning här?

Hur ser HTML-koden ut för respektive?

Jag tänkte på den HTML-kod som slutligen genereras och visas i webbläsaren. Om du kan ge en länk till WordPress-sidan (här eller som ett PM om det passar bättre) så kan jag kolla på det själv. Jag tänkte att det kanske kunde ge en ledtråd till varför siffran hamnar på egen rad.

Det hela beror på att CSS-koden för <a>-element i <li>-element i
diven .leftColumn (hehe) innehåller följande rad:

display: block;

Koden ser ut så här i CSS-filen:

.leftColumn li a, .leftColumn p a {
	color: #666;
	margin: 0px;
	text-decoration: none;
	display: block;
	padding: 5px 0 5px 0;

}

Det gör att <a>-elementent blir ett blockelement och tar upp hela raden. En lösning kan vara att låta siffrorna med antalet också stå innanför <a>-taggen.

Jag vet inte riktigt hur man skulle få till med en template tag i Wordpress (det går inte med wp_list_cats iallafall), men kan du hacka i PHP-koden där så ska HTML-koden som det hela genererar se ut såhär på ett ungefär (en rad i kategorilistan):

<li><a href="http://www.ljunghall.nu/blog/category/osorter..." title=" Visa alla osorterade inlägg.">Osorterat (15)</a></li>

istället för nuvarande:

<li><a href="http://www.ljunghall.nu/blog/category/osorter..." title=" Visa alla osorterade inlägg.">Osorterat</a> (15)</li>

Som sagt, hur du får till det vet jag inte riktigt Hoppas det ordnar sig.

I sidebar.php finns bara anropet till wp_list_cats(), det är den funktionen i sig som behöver hackas. Eller bättre: "överridas" (eller hur man säger på svenska), dvs att man gör en kopia på funktionen eller en plugin som tar över funktionen och förbättrar den utan att man måste hacka i grundkoden för WordPress, så man slipper hålla reda på manuella ändringar när man ska uppdatera WordPress). Jag är dock för rostig på WordPress för att kunna säga hur man går tillväga såhär spontant.

Enklast är väl att sätta [FONT="Courier New"]display: block;[/FONT] på [FONT="Courier New"]<li>[/FONT] istället. Ändra i [FONT="Courier New"]style.css[/FONT] så här:

[FONT="Courier New"].leftColumn li {
display: block;
}
.leftColumn li a, .leftColumn p a {
color: #666;
margin: 0px;
text-decoration: none;
padding: 5px 0 5px 0;
}[/FONT]

Jag har inte testat med dina filer, men resultatet borde bli vad du vill åstadkomma.

[FONT="Courier New"].leftColumn li[/FONT] är redan [FONT="Courier New"]display: block;[/FONT] så vitt jag kan se. Tar man bort [FONT="Courier New"]display: block;[/FONT] från [FONT="Courier New"].leftColumn li a[/FONT] så ger det lite effekter på padding mm (testade lite med Edit CSS i Web Developer). Men annars är ju tanken rätt, lyckas man ändra det med CSS är det nog enklaste sättet.

Detta finns inte i Wordpress från början utan kräver eget PHP-knackande eller en plugin för att fungera. Här finns en Wordpress-plugin, bdp-comments, som innehåller en funktion för det du söker: http://www.ozpolitics.info/blog/?page_id=164#comments

Jag kan kanske pilla lite med CSS:en imorgon om jag inte har nåt annat för mig

Lägg till detta i CSS:en:

.leftColumn li a,
.leftColumn li a:link,
.leftColumn li a:visited {
text-decoration: none;
color: #333;
}

.leftColumn li a:hover {
text-decoration: underline;
}

Så blir det nog fint tror jag

OK, tittade lite närmare på det med dina filer. Byt ut från rad 179 till det här:

[FONT="Courier New"].leftColumn li {
display: block;
margin: 0;
background: #fff url('images/dotted.gif') repeat-x bottom;
padding: 5px 0 5px 0;
}

.leftColumn p {
margin: 0;
background: #fff url('images/dotted.gif') repeat-x bottom;
padding: 2px 0 3px 0;
}

.leftColumn li a, .leftColumn p a {
color: #666;
margin: 0px;
text-decoration: none;
}
[/FONT]

Dina senaste kommentarer kommer också att förändras på så vis att kommentarskribenten hamnar på samma rad som kommentaren. Du får väl avgöra om det är OK eller inte. Kanske kommentarspluggen behöver modifieras om du vill ha något annat utseende på det...

183 till och med 199 byter du ut mot mina nya.