Antwort #4 am: 03. Juli 2009, 10:53:10
Hallo Christian,
ich fange nochmal ganz am Anfang an...
Ich habe mir das Modul C-List (
Kategorien auf der Startseite anzeigen) installiert und möchte es gern auf das modified eCommerce Shopsoftware-Design anpassen. Das Modul selbst stellt die Kategorien auf der Startseite dar, allerdings in einem fiesen Tabellenlayout.
Ich möchte es komplett in CSS mit DIVs machen und das überarbeitete Modul dann hier hochladen.
So weit, so gut...
Hier die CSS:
#cat_show1 {
width:100%px;
min-height:200px;
background-color:#EDEDED;
border:solid #ccc;
border-width:1px 0px 1px 0px;
padding:5px 0px 0px 0px;
}
#cat_show2 {
width:165px;
height:250px;
color:#000000;
background-color:#EDEDED;
border:solid #ccc;
border-width:1px 1px 1px 1px;
margin:0px 4px 5px 4px;
float:left;
}
#cat_show3 {
width:165px;
height:250px;
}
#cat_show_name {
width:165px;
height:40px;
background-color:#666666;
display:table-cell;
text-align:center;
vertical-align:middle;
}
#cat_show_text {
width:165px;
height:70px;
background-color:#EDEDED;
text-align:center;
vertical-align:middle;
}
#cat_show_text #p {
margin:0px 0px 0px 0px;
background-color:#ccc;
}
#cat_show_image {
width:165px;
height:140px;
background-color:#EDEDED;
text-align:center;
vertical-align:middle;
}
#cat_clear {
clear:both;
height:0;
margin:0;
padding:0;
font-size:0;
}
Hier die categories_list.html:
{config_load
file="$language/lang_$language.conf" section
="boxes"}<div id
="cat_show1"> {foreach name
=aussen item
=module_data from
=$module_content} <div id
="cat_show2"> <div id
="cat_show3"> <div id
="cat_show_name"> <a href
="{$module_data.CATEGORY_LINK}">{$module_data.CATEGORY_NAME
}</a
> </div
> <div id
="cat_show_text"> {if $module_data.CATEGORY_DESCRIPTION
!=''} <a href
="{$module_data.CATEGORY_LINK}"> {$module_data.CATEGORY_DESCRIPTION
} </a
> {else} Keine Beschreibung
! {/if} </div
> <div id
="cat_show_image"> {if $module_data.CATEGORY_IMAGE_TRUE
!=''} <a href
="{$module_data.CATEGORY_LINK}"> <img src
="{$module_data.CATEGORY_IMAGE}" alt
="{$module_data.CATEGORY_NAME}" /> </a
> {else} Kein Bild vorhanden
! {/if} </div
> </div
> </div
> {/foreach} <div id
="cat_clear"> </div
></div
> Soweit geht auch alles, aber:
Die Kategoriebeschreibung wird als <p>blablabla</p> eingefügt.
Da aber:
/* PARAGRAPH GLOBAL */
p {
margin:8px 0px 8px 0px
}
wird dies auch auf die Kategoriebeschreibung angewendet.
Ich habe versucht:
#cat_show_text #p {
margin:0px 0px 0px 0px;
background-color:#ccc;
}
aber ohne Auswirkung.
Genau so verhält sich der a-Tag bei dem Kategorienamen.
Was mache ich den falsch?
[ Für Gäste sind keine Dateianhänge sichtbar ]