Hi Leute,
ich hoffe ihr erschlagt mich nicht wenn euch mein Problem schildere.
Ich habe ein Plugin für ein Shop System geschrieben und möchte nun via CSS auf Ausgabe Page formatieren. Ich muss dazu sagen, ich den letzten Monaten habe ich mich nicht wirklich mit CSS beschäftigt eher mit PHP und MySqli.. :-/
Daher bin ich schon ein wenig eingerostet was meine CSS Skills betrifft, also seht mir dies bitte nach! Ich habe natürlich auch schon gegooglet und in meinen alten Templates nach meinen damaligen Lösungsansätzen für dieses Problem gesucht aber kein Ansatz funktionierte..
Habe es mit Textausrichtung versucht, über margin auto 0; etc.. Ich komme nicht voran..
die Page Seite
Code:
<div class="rss_container">
<div id="rss_title">TITLE</div>
<div style="clear:both"> </div>
<ul class='ul_img'> </h1>
<li><img src="{php} echo $_SESSION['cu_rss_conf']['xml_links']['link_bestseller']; {/php}"></li>
<li><img src="{php} echo $_SESSION['cu_rss_conf']['xml_links']['link_special_price']; {/php}"></li>
<li><img src="{php} echo $_SESSION['cu_rss_conf']['xml_links']['link_new_products']; {/php}"></li>
</ul>
<ul class='ul_link'></h1>
<li><a href="export/{$bestseller}" target="_new">Bestseller</a><br /></li>
<li><a href="export/{$special}" target="_new">Sonderangebote</a><br /></li>
<li><a href="export/{$product}" target="_new">Neue Produkte</a><br /></li>
</ul>
<div style="clear:both"> </div>
<!-- hebt die floats auf, da diese sonst verhindern würden das sich der umspannende Div
rss_container an die Größe des Inhalts anpassen würde -->
</div>
Meine CSS Datei
Code:
/* defines charset for css definitions */
@charset "UTF-8";
a:link { text-decoration:none; }
ul { list-style-type: none; }
/* Style Sheet for RSS Plugin Page*/
/* contains title div and rss list*/
.rss_container{
background-color: aqua;
height: auto;
width: auto;
}
.rss_container #rss_title{
float: left;
width: auto;
height: 26px;
padding-left: 26px;
background-color: orange;
}
/* left list side (Rss Images) */
/* ul element which contains RSS image*/
.ul_img{
float: left;
width: auto;
}
/* list element which contains RSS image*/
.ul_img li{
height: 26px;
border-bottom: 1px dotted #6a6a6a;
}
/* rss image*/
.ul_img li img{
padding: 2px 2px;
height: 22px;
width: 22px;
}
/* right list side (Rss links) */
/* ul element which contains RSS links*/
.ul_link{
float: left;
padding: 0px 5px;
width: auto;
}
/* list element which contains RSS links*/
.ul_link li{
border-bottom: 1px dotted #6a6a6a;
height: 26px;
background-color: yellow;
}
/* RSS link*/
.ul_link li a{
background-color: #6a6a6a;
font-family: Arial, Helvetica, sans-serif;
}
So sieht es momentan aus, die background-color habe ich nur so gesetzt um die Ausrichtung der Elemente besser zu beurteilen..
[IMG]
[/IMG]
Ich fürchte es ist ein banales Problem, der Titel im oberen orangen Div läst sich nicht vertical zentrieren und die Links (grau) auch nicht. Dies würde ich halt gern behaben. Gleich noch eine blöde Frage, ist es möglich das ich die größe des Links direkt an das Li Element anpasse, so das der exakt die Größe des li Elements hat..