boxes.css - Kategorien alphabetisch sortieren

[StefanWaltenberger]

Hallo,
nachdem mir Hanspeter vorhin so schnell geholfen hat, bin ich jetzt ganz heiß

Ich habe folgendes Problem:
Meine Kategorien werden falsch angezeigt. Siehe Hardcopy.
Ich hätte gerne, dass die Kategorien richtig angezeigt werden und zwar linksbündig und alphabetisch aufsteigend.
Ich denke, ich muss das in der boxes.css machen (Datei anbei).
Leider fehlen mir hier die Kenntnisse.
Kann mir jemand helfen?
Danke in voraus.
Gruß Stefan

Technische Spezifikation:
Link zum Shop: www.anderes-spielen.de
Template: simple-xtc
Shopssoftware: modified eCommerce Shopssoftware v1.06 rev 4356 dated: 2013-01-23
Datenbank Version: "MOD_1.0.6.0"
PHP-Version: PHP 5.4
MySQL-Version: MySQL5

Code: PHP  [Auswählen]

@charset 'utf-8';
#boxes_1,#boxes_2,#boxes_3,#boxes_4,#boxes_5,#boxes_6{
        width: 100%;
        float: left;
}
#boxes_2,#boxes_3,#boxes_4,#boxes_5,#boxes_6{

}
/* Box IDs */
#boxCart,
#boxQuickie,
#boxAdmin,
#boxBestSellers,
#boxLastViewed,
#boxLogin,
#boxNewsletter,
#boxSearch,
#boxSofortueberweisung,  /* Noch Uebersetzen */
#boxWhatsnew,
#boxCategories,
#boxContent,
#boxCurrencies,
#boxCustomer_Group_Info,
#boxInfobox,
#boxChangeLangeuages,
#boxOrder_history,
#boxReviews,
#boxSpecials,
#boxManufacturers,
#boxGuestnewsletter,
#boxManufacturers_Info{}

/* Box classes */
.box{}
.boxContainer{}
.boxTax{}
.boxVPE {}
.cartContainer{}
.bestProduct{}
.bestProductPrice{}
.bestProductImage{}
/**************************** Box Styling ****************************/
/* Global styling for bottom boxes*/
/*.box{
        background: #fff url('img/box_bg.gif') repeat-x left top;
        border: 1px solid #eee;
        width: 33%;
        margin: 1em 1em;
        float: left;
        padding: .5em .75em;
}
.box h4{
        font-size: 110%;
        font-weight: normal;
        margin-bottom: .5em;
}
*/
/**** boxContent Start ****/
#boxContent{padding-top: .25em; }
#boxContent ul {
        margin-left: 0
}
#boxContent ul li {display: inline; margin: 0 2em 0 0}
#boxContent ul li a {
        padding: em 0em;
        font-size: 90%
}
/**** boxContent End ****/
/**** boxCategories Start ****/
#boxCategories{
        z-index: 1;
        width: 100%;
        float: right;
}

/**** boxCategories End ****/


#checkoutProcess{
        background: #fff url('img/box_bg.gif') repeat-x left top;
        border: 1px solid #eee;
        width: 100%;
        float: left;
        margin-top: .5em;
}
#checkoutProcess ul{border-right: 1px solid #A5B0BE;padding: 0; margin: 0;}
#checkoutProcess li{float: left; display: block; width: 24.5%; padding: .25em 0 0 0; margin: 0;text-align: center;height: 40px;border: 1px solid #A5B0BE; border-width: 0px 1px 0 0;}
#checkoutProcess .liNoBorder{border-width: 0}

li.now{list-style-type: none; background: url(img/process_now.gif) no-repeat center 22px;}
li.later{list-style-type: none;background: url(img/process_later.gif) no-repeat center 22px;}
li.ready{list-style-type: none; background: url(img/process_ready.gif) no-repeat center 22px;}

/* Form BoxSearch Start */
#quick_find input{margin:0; padding:0; float: left}
/* Form BoxSearch End   */

/* Form BoxQuickie Start */
#quick_add input{margin:0; padding:0; float: left}
/* Form BoxQuickie End   */

/* Style boxWhatsnew Start */
#boxWhatsnew .txtAlignCenter{border: 1px solid #eee; background-color: #fff}
#boxWhatsnew img{}
#boxWhatsnew h5{margin-top: .75em; font-size: 85%; font-weight: bold}
#boxWhatsnew p{padding: .25em 0 0 1em; font-size: 70%}
/* Style boxWhatsnew End   */

/* Style box_last_viewed Start */
#boxLastViewed .txtAlignCenter{border: 1px solid #eee; background-color: #fff}
#boxLastViewed img{}
#boxLastViewed h5{margin-top: .75em; font-size: 85%; font-weight: bold}
#boxLastViewed p{padding: .25em 0 0 1em; font-size: 70%}
#boxLastViewed .txtAlignLeft{padding-left: 0;}
/* Style box_last_viewed End   */

/* Style boxBestSellers Start */
#boxBestSellers ol {margin: 0; padding:0; }
#boxBestSellers ol li {margin-bottom: .25em}
/* Style boxBestSellers End   */

/* Style boxReviews Start
#boxReviews .infoBoxContents {vertical-align:middle}
#boxReviews .infoBoxContents a {font-size: 80%; float: left; margin: .5em;}
#boxReviews .infoBoxContents img{padding: .5em; border: 1px solid #eee; background-color:#fff}
 Style boxReviews End   */

/* Style boxReviews Start */
#boxReviews .txtAlignCenter{border: 1px solid #eee; background-color: #fff}
#boxReviews p{padding: .25em 0 0 0; font-size: 70%}
/* Style boxReviews End   */



#topbar{padding-right: 5px;text-align:right }
#boxAdmin {position: relative; text-align:right;top: 4px;background-color:transparent;display:inline;padding: 0 10em 0 5px}
#boxAdmin .dropdown{left:0}
#box_search {position: relative; text-align:right;top: 4px;background-color:transparent;display:inline;padding: 0 5px}
#box_cart {position: relative; text-align:right;top: 4px;background-color:transparent; display:inline;padding: 0 5px}
#loglink{position: relative; text-align:right;top: 4px;background-color:transparent; display:inline;padding: 0 5px; margin-right:10em;}
#loginlink{position: relative; text-align:right;top: 4px;background-color:transparent; display:inline;padding: 0 5px;}
#checkoutlink{position: relative; text-align:right;top: 4px;background-color:transparent; display:inline;padding: 0 5px}
.dropdown{display: none}
.dropdown{
        width: 250px;
        background-color: #f6f6f6;
        color: #A5B0BE;
        position: absolute;
        z-index: 20;
        margin-top: 4px;
        padding: 5px;
        border: 1px solid #eee;
        border-top:none;
        text-align: left;
        right:5px
}
.dropdown a{font-weight: normal;font-size: 100%;}
.serviceNav {display: inline; background-color: #f6f6f6; height: 20px; color: #ffa800;}
.serviceNav a{ font-weight:bold; font-size: 80%;padding: 0 5px 2px 5px;}

#quick_find legend{font-size: 100%;text-align: left; color: #A5B0BE; font-weight:bold}
.cartPrize{float:right; font-size: 90%}
.cartProduct{border-bottom: 1px solid #A5B0BE}

.box{
        background: #fff url('img/box_bg.gif') repeat-x left top;
        border: 1px solid #eee;
        padding: 10px
}
.adressbox{
        background: #fff url('img/box_bg.gif') repeat-x left top;
        border: 1px solid #eee;
        width: 16em;
        margin: 1em 1em;
        float: left;
        padding: .5em .75em;
}

Linkback: https://www.modified-shop.org/forum/index.php?topic=31188.0

[Matt]

Ein CSS-File hat mit der Sortierung nichts zu tun. Zuständig dafür ist der Wert, der für die Sortierung im Feld im Backend eingetragen ist.

[StefanWaltenberger]

Hallo Experte,
danke für deine Nachricht.
Das habe ich, so denke ich, richtig gemacht (siehe Hardcopy).
Das ist nicht das Problem.
Gruß Stefan

[Matt]

Das stimmt. Und in dem Fall liegt es wirklich am float:right von .nav li.

Also so ändern:

Code: CSS  [Auswählen]

.nav li {
    margin: 0;
    padding: 0;
    position: relative;
    list-style-type: none;
    width: auto;
    display: inline;
}

Code: CSS  [Auswählen]

.nav {
    [...]
    text-align: right;
}

Code: CSS  [Auswählen]

.nav li a, .nav li a:link, .nav li a:active, .nav li a:visited {
    font-size: 1.15em;
    background: #fff;
    color: #A5B0BE;
    display: inline-block;
    padding: 0 14px 9px 14px;
    text-decoration: none;
    border-left: 1px solid #fff;
    white-space: nowrap;
}

[StefanWaltenberger]

Hallo Experte,
ich habe in der boxes.css gesucht.
Ich habe aber deine Angaben nicht gefunden.
Kannst du mir das bitte noch mal genauer erläutern.
Danke.
Stefan

[hpzeller]

Hallo StefanWaltenberger

suche in templates/simple-xtc/stylesheet.css nicht boxes.css ab Zeile 242

Code: CSS  [Auswählen]

.nav li {
  float: right;

und ersetzen mit

Code: CSS  [Auswählen]

.nav li {
  float: left;

oder mit

Code: CSS  [Auswählen]

.nav li {
 /* float: right; */

wenn alles linksbündig untereinander angeordnet sein soll.

Gruss
Hanspeter

[StefanWaltenberger]

---

[hpzeller]

--

[StefanWaltenberger]

Hallo Experte, hallo Hanspeter,
das hat ja schon wieder funktioniert.
Siehe Hardcopy.
Das Forum und ihr seid echt der Hammer.
Vielen Dank und eine gute Nacht.
Gruß Stefan

[StefanWaltenberger]

Hallo Hanspeter,
doch.
Ich habe nur in zeile 243
float: right; 
nach
float: left;
geändert.
Sonst nichts....
Gruß Stefan

Code: PHP  [Auswählen]

@charset 'utf-8';
@import url(css/reset.css);
@import url(css/lightbox.css);
@import url(css/boxes.css);

/* ----------------------------------------------------- Page layout */
html * { font-size: 100.01% }
textarea, pre, tt, code {
        font-family:"Courier New", Courier, monospace;
}
body {
font-family:  Helvetica, Verdana,Arial, sans-serif;
font-size: 75.00%;
color: #000000;
background: #fff;
}

h1,h2,h3,h4,h5,h6 {
        font-family:Helvetica, Verdana,  Arial, sans-serif;
        font-weight:bold;
        color:#ffa800;
       margin: 0 0 0.5em 0;
}

h1 { font-size: 200% }
h2 { font-size: 180%;color: #A5B0BE; }
h3 { font-size: 150% }
h4 { font-size: 133.33% }
h5 { font-size: 116.67% }
h6 { font-size: 116.67%; font-style:italic }


.color1{color:#A5B0BE;}
h2.color1{font-weight:normal}
p { line-height: 1.5em; margin: 0 0 1em 0; }

/* lists */
  ul, ol, dl { margin: 0 0 1em 1em }
  li { margin-left: 1.5em; line-height: 1.5em; }
  ol {list-style-type: decimal;}
  ul {list-style-type: square}
/* End */

#wrap {
       text-align:left;
        margin: 0 auto 0 auto;
        width: 960px;
        background-color: transparent;
}
#page_margin{margin: 0 10px}
#main_content {

        width: 100%;
        position: relative;}


#header{
       position: relative;
        margin: 3em 0 6em 0;
}
#footer {
       width: 960px;
margin: 7em auto 0 auto;
        height: 20px;
        border-top: 1px solid #eee;}
}

/* #account includes Login, Shopping-Cart, checkout-shipping */
#account{
padding-bottom: .25em;
border-bottom: 1px solid #ffa800;
}

.btn img{position:absolute; margin-top: 6px;}
p.btn a {padding: 0 0 0 0;}
.btn2{margin-top: 5px;}
.btn2 input{position:absolute; margin-top: 0px;}


/* Main Content */

/**************************** Links ****************************/
a {
        text-decoration: underline;
        color: #ffa800;
}
a:hover,
a:active,
a:focus {
        color: #333;
       text-decoration: underline;
}
#topbar a, #footer a, .copyright a, .kmtemplates a, .parseTime a{text-decoration: none;}
#footer a:hover, .copyright a:hover, .kmtemplates a:hover, .parseTime a:hover{text-decoration: underline;}

.start_img {float: left; padding-right: 20px; padding-top:30px; }
.start_p {line-height: 20px; padding-top:30px;}


/******* Productlisting Start *******/
#product_listing{
       margin-bottom: 2em;
}
.product1{
        margin-top: 0em;
        width: 224px;
        float: left;
        text-align: center;
}
.product2{
        margin: 0em 12px 0 20px;
        width: 224px;
        float: left;
        text-align: center;
}
.product3{
        margin: 0em 20px 0 12px;
        width: 224px;
        float: left;
        text-align: center;
}
.product4{
        margin-top: 0em;
        width: 224px;
        float: right;
        text-align: center;
}
/* delete */
.product_image_con img{
        position: relative;
        height: 150px
}
.product1 h3, .product2 h3, .product3 h3, .product4 h3{
        font-size:100%;
        line-height: 140%;
        font-weight: bold;
        margin: 1em 0 .5em 0;
        text-align: center;
}

.product_listing_row {margin: 1em 0; padding: 0em 0; display: block; float:left;}
.product1 h3 a,.product2 h3 a,.product3 h3 a,.product4 h3 a {text-decoration: none}
.product1 h3 a:hover,.product2 h3 a:hover,.product3 h3 a:hover,.product4 h3 a:hover{
        color: #ffa800;
       text-decoration: underline;
}
.product1 p,.product2 p,.product3 p,.product4 p {font-weight: bold;text-align: center;}
/******* Productlisting End *******/

/******* Product Info Start *******/
#single_product {width: 100%;position: relative;margin: 1em 0}
#single_product_image{height: 360px;}
#single_product_image a img{margin: .75em 0;}
#single_product_text {}
#single_product_text h1 {color: #A5B0BE; font-size: 200%; font-weight: bold;}

#single_product .left,
#single_product .right {width: 50%;}
#product_options{float: right; width: 100%;}
#product_options label{width: 15%;
}
#single_product_image_add {float: left}
#single_product_image_add img{width: 15%; padding: 0 4em 0 0; margin-right: 2em;}
.note{ padding: .5em; font-size: 70%;}
p.history_products {font-weight: normal;}

#product_info input[type=image]{position: relative; padding: 0;top:13px; height: 20px;}
#product_info input[type=text]{height: 18px; line-height: 100%; font-size: 100%;
padding:0px;margin:0; background-color: #fff}
strong.price{font-size: 120%}
strong.price{font-size: 120%}

input[type=radio]{position: relative;left: 5px; margin-right: 10px}
/******* Product Info Start *******/


.clear{ clear:both;}
input{margin: .5em 0;}
#footer a{color: #A5B0BE;}
/* Create Account*/
#account0 input,#account2 input,#account3 input,#account4 input {
color: #000;
font: 80% verdana, arial, helvetica, sans-serif;
margin: 2px 0 8px 0;
padding: 2px;
width: 300px;
}
#account0 label,#account2 label,#account3 label,#account4 label,label{
display: block;
}
label.label_inline{display: inline;}
#account0 label.gender{display: inline; line-height: 180%;}
fieldset{border: 1px solid #eee; margin-top: .5em; padding: .5em}
div.left{width: 45%;float: left;}
div.right{width: 45%;float: right;}
div.full,p.full {width: 100%; text-align: center;}
fieldset legend{padding: 3px 6px; color: #ffa800;}


.note{ padding: .5em; font-size: 70%;}
p.history_products {font-weight: normal;}

#table_order_details{margin: 1em 0; width: 100%; color: #666;line-height: 1.5em;}
#table_order_details td{border-bottom: 1px solid #A5B0BE; padding: .75em}
#table_order_details th {border-bottom: 1px solid #A5B0BE;text-align: center; font-weight: bold;}
#table_order_details tfoot td{border-bottom: none; border-top: 2px solid #A5B0BE;}
.prodRow1{background-color: #fff;}
.prodRow2{background-color: #EDEFF1;}
.prodRow2 td {}
.prodRow2 td a {color: #ffa800; text-decoration: underline;}
.prodRow1 td a {color: #ffa800; text-decoration: underline;}
.quantity{text-align: center;}
.productName{}
.productAttributes{}
.attribute{}
.value{}
.singlePrice{text-align: center;}
.totalPrice{text-align: center;}
.delete{text-align: center;}
.subTotal{background-color:#F4F5F7;}
#table_order_details p{font-size: 100%;}
strong {font-weight: bold;}
#table_order_details th.productName{text-align:left;}



/****** jQuery *******/
/* Navigation */
.nav, .nav ul {
        list-style: none;
        margin: 0;
        padding: 0;
}

.nav {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 90%;
  z-index: 1;
  position: relative;
}
.nav li ul{z-index:10}
.nav li {
  float: left;
  margin: 0;
  padding: 0;
  position: relative;
list-style-type:none;
        width: auto
}
.nav li a, .nav li a:link, .nav li a:active, .nav li a:visited {
        font-size: 1.15em;
  background: #fff;
 color: #A5B0BE;
 display: block;
  padding: 0 14px 9px 14px;
  text-decoration: none;
border-left: 1px solid #fff;
}

.nav li a:hover {
  color: #ffa800;
       text-decoration: underline;
}
#CatNavi li:hover a,
#CatNavi li.sfHover a {
       color: #ffa800;
}
#CatNavi li:hover ul a,
#CatNavi li.sfHover ul a {
 width: 100%;
  background: #f6f6f6;
 color: #959595;
 text-decoration: none;
}
#CatNavi li:hover ul a:hover,
#CatNavi li.sfHover ul a:hover {
 color: #ffa800;
}

.nav ul {
  background: #f6f6f6;
 list-style: none;
  margin: 0;
width:100%;
display: block;
  position: absolute;
  top: -999em;
/*  left: -1px;*/
}
.nav li:hover ul,
.nav li.sfHover ul {
  top: 1.5em;
}
.nav ul li {
  float: none;
}
.nav ul a {
border:2px solid #f6f6f6;

  white-space: nowrap;
  text-decoration: none;
}
.nav ul a:hover {
  background: #ccc;
 color: #ffa800;
}

/* Navigation Ende **************************/

.headerError,
.errorTxt{color: red}

td.messageStackError{color: red; padding-bottom: .25em;}
td.messageStackSuccess{padding-bottom: .75em; color: green}
/* Produktnavigation Seiten vor zurück*/
.smallText{font-size: 80%; border-bottom: 1px solid #A5B0BE;padding-bottom: .25em;}
/* Ende */
p.txtRight{text-align: right}
span.status{color: #666;}
.edit_btn{font-size: 70%;padding-left: 3em;}

.floatingInput label{float: left; width: 10em; padding-top: .5em;}
.thx{font-size: 110%; font-weight:bold;margin-top: 1em;}

/****** Account History Info *****/
div.history table td{padding-right: .5em}



.standard_adress{font-size: 60%; color: #666;font-weight: normal}
p.centerTxt{text-align: center;}
#confirmation_products table {color: #666;margin: .25em 0 0 0;padding: .25em 1em;border: 1px solid #000; font-size: 100%;line-height: 130%}
#confirmation_products table td.main{padding: 0}
#confirmation_products table td.main small {font-size: 80%}
#confirmation_total table{width: 100%;text-align: right;float: left;background-color:#f7f7f7;padding: .25em 1em;font-size: 100%;line-height: 160%;}
#confirmation_total table .main{width: 50%;background-color:#f7f7f7; color: #666;padding: 0 0 .75em 0; line-height: 130%}
#confirmation_products table td.main{width: 50%}
.payMod1{background-color:#f7f7f7;border-top: 1px solid #666;padding: .5em;width: 100% }
.payMod2{background-color:#fff;border-top: 1px solid #666;padding: .5em;width: 100% }
.payModTitle{height: 2.5em; display: block;padding: .5em 0 0 0 ;}

/* Style Advanced Search Start */
.advanced_search div{padding: .25em 0;clear:both;}
.advanced_search div label{padding-bottom: .25em}
.advanced_search div select,
.advanced_search div input{ margin: 0 0 .5em 0; padding: 0 0 0 0;}
/* Style Advanced Search End   */


/* Style Popup Start */
div.popup{margin: 20px .5em 1em .5em}
/* Style Popup End   */

img.txtFloatRight{margin-left: .75em;}
img.txtFloatLeft{margin-right: .75em;}
.txtFloatRight{float:right}
.txtFloatLeft{float:left}
.txtAlignRight{text-align:right}
.txtAlignLeft{text-align:left}
.txtAlignCenter{text-align: center}
hr {border: 1px solid #eee;}
hr.categories {margin: 2em 0}
/* Product Review */
#product_review .txtFloatLeft img{float: left; padding: 0; border: 1px solid #eee; background-color:#fff; margin: 0}
#product_review {width:100%; font-size: 90%}
#product_review tr.row1 {background-color:#fff;}
#product_review tr.row2 {background-color:#eee;}
#product_review th, #product_review td {padding: .5em;}
#product_review .id {width: 5%;}
#product_review .author {width: 35%;}
#product_review .rating {width: 35%;}
#product_review .date {width: 25%;}

/* alsopurchased */
.alsopurchased .txtAlignCenter{border: 1px solid #eee; background-color: #fff}
.alsopurchased h5{margin-top: .75em; font-size: 85%; font-weight: bold}
.alsopurchased p{padding: .25em 0 0 1em; font-size: 70%}

.search_result div,
.search_result div img,
.search_result div p {float:left; line-height:19px;}
.search_result div img {margin: 1em 1.5em 1em 0;}

/***** INPUt FIELDS *****/
#new_find input[type=image]{position: relative; padding: 0;top:10px;}
#new_find input[type=text]{position: relative;top: 0;height: 12px; line-height: 100%; font-size: 100%;}



/**** Module ****/

/**** Shipping Block ****/
.shipping_price{color: #666}
#shipping_block{margin-top: 1.5em}
.shipping_module{border-bottom: 1px solid #eee; border-width: 1px 0; padding-bottom: .5em;margin: 1.5em 0}
.shipping_module input {margin: 0 .5em}
.shipping_module h3{margin-bottom: .25em}

/**** Adressbook Module ****/
#adressbook table {width: 100%; border: 1px solid #eee; border-width: 1px 0;}
#adressbook table table {border: none}
.moduleRowOver {
        background-color: #f6f6f6;
       border: 1px solid;
        border-color: #000000;
 margin-bottom: 10px;
  padding: 5px;

        }
.moduleRowSelected {
        background-color: #f6f6f6;
       margin: 0;
        padding: 5px;
}
#adressbook table td.main{padding-bottom: .5em; }

/*** Popup Infobox ***/
table td.infoBoxHeading img {display: none}
table td.infoBoxHeading {color: #ffa800; font-size: 120%; font-weight: bold; padding: 15px 0 10px 0}
span.main,
span.tableHeading {display: block; padding-bottom: 8px; }
span.boxText{font-size: 100%; padding-bottom: 8px;display: block}

/*** Ppoup Content ***/
td.main{padding: 10px}
td.contentsTopics{padding: 15px 10px 0 10px; color: #ffa800; font-size: 120%; font-weight: bold;}

.inputRequirement{}
.btn3 input{position:relative; margin-top: 0; margin-bottom: 0}
.btn3 img{position:relative; margin-top: 0px;}
#cat_listing {border-top: 1px solid #eee;border-weight: 1px 0px 0px 0px; padding-top: .75em;}
#cat_listing ul {margin-left: 0;border-bottom: 1px solid #eee;height: 2em;}
#cat_listing ul li {float: left; list-style:none; margin: 0 1.5em 0 0;}
#cat_listing a, #cat_listing a:visited, #cat_listing a:active {color: #A5B0BE; text-decoration: none;}
#cat_listing a:hover, #cat_listing a:focus {color: #FFA800;}
.privacy {padding-left: .5em;}
.privacy a {text-decoration: none;}
/**************************** kmTemplates.com Copyright ****************************/
.parseTime, .kmtemplates{display:none;}

.copyright{
font-size: 90%;
width: 960px;
margin: 2em auto;
padding: .25em 0 30px 0;
}
.copyright, .copyright a {color: rgb(240,240,240);}

/**************************** xt:Commerce Copyright & ParseTime ****************************/

#vacation{position: absolute; top: 85px; border: 1px solid #999; padding: .75em}

[Matt]

float left/right ist natürlich die low hanging fruit hier, dann sieht es aber nicht mehr aus wie vorher (rechtsbündige Ausrichtung). Dazu musst du meine etwas umfangreicheren Änderungen implementieren.

[hpzeller]

Hallo Matt

[...]
Ich habe folgendes Problem:
Meine Kategorien werden falsch angezeigt. Siehe Hardcopy.
Ich hätte gerne, dass die Kategorien richtig angezeigt werden und zwar linksbündig und alphabetisch aufsteigend.
[...]

Deinen Einwand "float left/right ist natürlich die low hanging fruit hier", kann ich vor dem Hintergrund des obigen Zitats nun wirklich nicht verstehen.

Gruss
Hanspeter

[Matt]

Das hab ich auch in der Tat überlesen