K2 tools (lista kategorii) Jak zrobić poziomą listę?

[paul3x]

Trochę pobawiłem się css K2 dzięki wspaniałemu dodatkowi Firebug. Zrobiłem tak jak prawie chciałem prócz tego, ze chciałbym mieć te kategorie poziomo jak np menu nawigacji. lista kategorii w K2 nie ma stylów css, jest tylko w formie ul li, więc dodałem display: inline; ale to na nic, tutaj kod:
/* --- Category List/Menu --- */
div.k2CategoriesListBlock {}
div.k2CategoriesListBlock ul {}
div.k2CategoriesListBlock ul li {}
div.k2CategoriesListBlock ul li a {}
div.k2CategoriesListBlock ul li a:hover {}
div.k2CategoriesListBlock ul li a span {}
div.k2CategoriesListBlock ul li a:hover span {}
div.k2CategoriesListBlock ul li.activeCategory {}
div.k2CategoriesListBlock ul li.activeCategory a {font-weight:bold;}
/* Root level (0) */
ul.level0 {}
ul.level0 li {}
ul.level0 li a {}
ul.level0 li a:hover {}
ul.level0 li a span {}
ul.level0 li a:hover span {}

/* First level (1) */
ul.level1 {}
ul.level1 li {}
ul.level1 li a {}
ul.level1 li a:hover {}
ul.level1 li a span {}
ul.level1 li a:hover span {}

/* n level (n) - like the above... */

a to po mojej zmianie:
/* --- Category List/Menu --- */
div.k2CategoriesListBlock {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
div.k2CategoriesListBlock ul {}
div.k2CategoriesListBlock ul li {
width: 170px;
padding-left: 0px;
background: #ccc url("obraz1.JPG") no-repeat left top;
border-style: solid;
}
div.k2CategoriesListBlock ul li a {
display: block;
width: 169px;
text-decoration: none;
padding: 15px 10px;
font-weight: bold;
background: url ("obraz1.JPG") repeat-x top;
color: green;
}
div.k2CategoriesListBlock ul li a:hover {
background-color: #797;
background-image: url("obraz2.JPG");
color: white;
}
div.k2CategoriesListBlock ul li a span {}
div.k2CategoriesListBlock ul li a:hover span {}
div.k2CategoriesListBlock ul li.activeCategory {}
div.k2CategoriesListBlock ul li.activeCategory a {font-weight:bold;}
/* Root level (0) */
ul.level0 {}
ul.level0 li {}
ul.level0 li a {}
ul.level0 li a:hover {}
ul.level0 li a span {}
ul.level0 li a:hover span {}

/* First level (1) */
ul.level1 {}
ul.level1 li {}
ul.level1 li a {}
ul.level1 li a:hover {}
ul.level1 li a span {}
ul.level1 li a:hover span {}

/* n level (n) - like the above... */

[Bazyl]

Witam,

Link do strony?

[paul3x]

strona jeszcze w budowie, ale kategorie są
http://youart.vot.pl

[Bazyl]

div.ja-moduletable ul li, div.ja-module ul li {
display: inline;
padding-left: 1px;
}

template.css (wiersz 1104)

div.k2CategoriesListBlock ul li a {
color: green;
display: block;
font-weight: bold;
padding: 15px 10px;
text-decoration: none;
width: 169px;
}

k2.css (wiersz 843

[paul3x]

niestety nie mogę mieć inline w template.css, bo w każdym module robi się inline

[Bazyl]

To zrób tak byś miał tylko w tym :)

id=Mod263

[paul3x]

coś mi nie wychodzi

[larry_krk]

to może pobaw się z float:left
div.k2CategoriesListBlock ul li {float:left;}, albo coś w tą mańkę.

// tylko usuń odgórnie ustaloną szerokość, bo się nie zmieści w tej kolumnie :)

[paul3x]

Dzięki wam za pomoc, przydała się. Nie tylko wy, ale potęga firebug. Poradziłem sobie z tym :D