Guten Tag,
ich benutze gerne Joomla für Homepages.
Nun wollte ich gerne dafür ein eigenes Template erstellen.
Doch das Menü macht mir einfach zu schaffen.
In der index.php habe ich das stehen
Im Quelltext auf der Homepage steht dann das.
So mein erstes Problem ist, dass die beiden Links direkt neben einander stehen und ich einfach keine Lücke dazwischen bekomme. Und zweitens finde ich keinen guten ansatz für ein Dropdown Menü. Denn alle die ich gemacht habe, hatten einen anderen Htmlteil. Aber hier kann ich den ja nicht verändern, oder****
Hier ist noch der Cssteil.
Hoffe ihr habt mein Problem verstanden und könnt mir helfen.![Smile :) :)](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f642.png)
ich benutze gerne Joomla für Homepages.
Nun wollte ich gerne dafür ein eigenes Template erstellen.
Doch das Menü macht mir einfach zu schaffen.
In der index.php habe ich das stehen
PHP:
<div id="top_menu">
<jdoc:include type="modules" name="top_menu" style="none" />
</div>
PHP:
<div id="top_menu">
<ul class="menu">
<li class="item-101 current active deeper parent">
<a href="/" >Home</a>
</li>
<li class="item-109">
<a href="/index.php/gaestebuch" >Gästebuch</a>
</li>
</ul>
</div>
So mein erstes Problem ist, dass die beiden Links direkt neben einander stehen und ich einfach keine Lücke dazwischen bekomme. Und zweitens finde ich keinen guten ansatz für ein Dropdown Menü. Denn alle die ich gemacht habe, hatten einen anderen Htmlteil. Aber hier kann ich den ja nicht verändern, oder****
Hier ist noch der Cssteil.
CSS:
#top_menu {
width: 752px;
height: 37px;
margin-left:auto;
margin-right:auto;
list-style:none;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#DD0005), to(#750003));
background: -moz-linear-gradient(0% 6% 270deg,#DD0005, #750003);
opacity: 0.8; /* modern browser */
-moz-opacity: 0.8; /* older Mozilla browser */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; /* IE8 in Standard Compliant Mode */
filter:alpha(opacity=80); /* IE5.x -7.0 */
}
.menu a {
text-decoration:none;
color: #FFF;
font-size:24px;
float:left;
}
.menu a:hover {
color: #FFF;
text-shadow: #000000 -1px 1px 2px;
text-shadow: #000000 -2px 2px 1px;
letter-spacing: 1px;
/*background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#292929), to(#9B9B9B));
background: -moz-linear-gradient(0% 6% 270deg,#292929, #9B9B9B); */
}
.menu {
list-style:none;
}
Hoffe ihr habt mein Problem verstanden und könnt mir helfen.
![Smile :) :)](https://cdn.jsdelivr.net/joypixels/assets/8.0/png/unicode/64/1f642.png)