Beiträge von klingi1977

  • Menü mit Grafik als Hintergrund

    Zitat von Sailor56

    Für die Höhe der Buttons... die eigentlich gar keine Buttons sind, sondern ein Hyperlink in einem Listenelement... ist wieder der Inhalt des <li> ... also das <a> zuständig.
    Teste mal das ..

    Code
    .secondary-navigation a {
  padding: 5px 0px;
  text-align: center;
}


    mit den 5px beim Padding beeinflusst du die Höhe!

    Danke für Eure Hilfe und Geduld!!!

    JA DAS WAR ES (.secondary-navigation a {
    padding: 5px 0px;
    text-align: center;
    }
    DANKE!!! :-)

  • Menü mit Grafik als Hintergrund

    Zitat von Sailor56

    Das 'Eckige' ist der Link Tag <a>..
    setze da mal für 'ul.menu li a { border-radius: 15px;}'

    Die Buttons kleiner? Mach das Padding bei ul.menu größer!


    Danke für deine Hilfe! Jetzt bin ich fast am Ziel meiner Wünsche :-)

    Das Mouseover Problem ist gelöst (ul.menu li a { border-radius: 15px;) DANKE!!!
    Jetzt hab ich noch das Problem mit der Größe des BUTTONS:
    - mit marign wird der Button von der Breite kleiner, allerdings ist der Text dann nicht mehr zentriert
    - gibt es eine Einstellung mit der ich die Buttons von der Höhe verändern kann?

    /*-- Menue Links --*/
    ul.menu {
    list-style-type: none;
    margin: 0;
    padding: 40px;
    }
    ul.menu li {
    border: 3px solid #000;
    border-radius: 15px;
    background-color: #99cc66;
    margin-bottom: 6px; /*-- Abstand zwischen den Menüpunkten --*/
    padding: 1px;
    text-align: center;
    }
    ul.menu li a {
    border-radius: 15px;
    text-decoration: none;
    color: #000;
    }
    ul.menu li:hover {
    background-color: #fff;
    }


    https://zweirad-aichinger.lima-city.de/

    DANKE LG, Markus

  • Menü mit Grafik als Hintergrund

    Zitat von b3317133

    Normalerweise erzeugt man solche Effekte ohne Grafiken nur mit CSS, hier ein Beispiel.

    Habe jetzt den Tipp von b3317133 weiter verfolgt! Das ganze sieht schon mal sehr gut aus!

    Verwende folgenden Code in meiner Custom CSS, wo muss ich den Code noch modifizieren damit den Button kleiner und der Text zentriert ist? Außerdem habe ich noch das Problem, dass ich bei Mouseover eine weißes Rechteck habe und keine Rundungen!

    /*-- Menue Links --*/
    ul.menu {
    list-style-type: none;
    margin: 0;
    padding: 0;
    }
    ul.menu li {
    border: 3px solid #000;
    border-radius: 15px;
    background-color: #99cc66;
    margin-bottom: 6px; /*-- Abstand zwischen den Menüpunkten --*/
    padding: 1px;
    text-align: center;
    }
    ul.menu li a {
    display: block;
    text-decoration: none;
    color: #000;
    }
    ul.menu li:hover {
    background-color: #fff;
    }


    Danke für Eure Geduld und Hilfe!

    LG, Markus