Suche im Forum:
Suchen


Autor Nachricht
Beitrag23.07.2016 um 16:18 (UTC)    
Titel: Design CLEAN-Fragen zur Navigation
Antworten mit Zitat
Hallo,

ich bräuchte mal Hilfe bei der Gestaltung der horizontalen Navigation beim Design CLEAN.

Arrow http://globe-testseite.de.tl/

Bin am suchen und finde den / die Fehler nicht, woran es liegen könnte.

....und zwar, habe ich im Designcode festgelegt, dass die Schriftfarbe auf den Button
weiss sein soll, angezeigt wird aber schwarz

2. beim Hover der Unterseiten, sowie bei der besuchten Seite wird die Buttongrafik nicht angezeigt

3. ebenso möchte ich beim Hover der Unterseiten und der besuchten Unterseiten einen transparenten Hintergrund haben, momentan ist der weiss

und 4. möchte ich, dass die Buttongrafik in voller Breite, also 185px angezeigt wird

ich poste mal noch den Code was ich da so zusammengebastelt habe, aber eben nicht funktioniert:
Code:

/* Menü-Leiste/Balken */
#secondmenu{
 background-color:transparent !important;
box-shadow: 0px 0px 0px 0px #333333;
}

/* Menü-Button */
#secondmenu li a {
width: 185px !important;
height: 40px;
font-family: balthazar !important;
font-size: 18px !important;
text-color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
background-color:transparent !important;
background:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton.png)no-repeat;   
border: 0px solid #000000;}

/* Hover-Button */
#secondmenu li a:hover  {
width: 185px !important;
height: 40px;
font-family: balthazar !important;
font-size: 18px !important;
text-color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
     background-color:transparent !important; 
background:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton-hov.png)no-repeat;
border: 0px solid #000000;}

/* aktuell besuchte Seite */
#secondmenu ul li.active a {
width: 185px !important;
height: 40px;
font-family: balthazar !important;
font-size: 18px !important;
text-color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
background-color:transparent !important;
background:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton-hov.png)no-repeat;}

/* Unterseiten */
#secondmenu ul ul li a {
height: 40px;
 line-height: 45px;
width: 185px !important;
height: 40px;
font-family: balthazar !important;
font-size: 18px !important;
text-color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
     background-color:transparent !important;
background:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton.png)no-repeat;
border: 0px solid #000000;}

/* Unterseiten-Hover */
#secondmenu ul ul li a:hover {
width: 185px !important;
height: 40px;
font-family: balthazar !important;
font-size: 18px !important;
text-color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
     background-color:transparent !important;
background:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton-hov.png)no-repeat;
border: 0px solid #000000;}

______________
mfG design-globe


Zuletzt bearbeitet von design-globe am 23.07.2016, 17:24, insgesamt 3-mal bearbeitet
↑
Beitrag23.07.2016 um 19:56 (UTC)    
Titel:
Antworten mit Zitat
Hallo,

der von dir gepostete Code bezieht sich auf das Menü auf Linker Seite.
Du verwendest das Menü oben.

Linkfarbe sprichst du mit #access li a { an. Bekommt der Eigenschaft color: #FFFFFF !important; wird Linkfarbe (oben) weiß,
auch die gewünschte Breite mit width: XXXpx; wird hier angegeben

Die Unterseiten wären #access ul ul li a { , das bekäme dann auch gewünschte Textfarbe und
wenn Hintergrundbild gewünscht hier das background-image: url(); und background-color: transparent!important;

Hier eine Übersicht der Klassennamen : http://clean-test.de.tl/Navi-oben-anpassen.htm

Ich hoffe das half dir weiter Wink
↑
Beitrag24.07.2016 um 00:03 (UTC)    
Titel:
Antworten mit Zitat
clean-test hat Folgendes geschrieben:
Ich hoffe das half dir weiter Wink


Crying or Very sad leider nicht, nichts davon funktioniert Rolling Eyes

im normalen Menübutton:
- falsche Schriftart und -farbe
- nicht die exakte Breite

Hover und besuchte Seite:
- Hintergrund weiss
- Höhe der Buttons zu hoch
- Buttonbeschriftung zu tief

Unterseitenmenü:
- Buttongrafiken werden garnicht angezeigt

und so sieht jetzt mein Code aus:
Code:

/* Menü-Leiste/Balken */
#access{
background-image: url(http://img.webme.com/pic/g/globe-testseite/schneidercont.png);
box-shadow: 0px 0px 0px 0px #333333;
}

/* Menü-Button */
##access li a {
width: 185px !important;
height: 40px !important;
font-family: balthazar !important;
font-size: 18px !important;
color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
background-color:transparent !important;
background-image:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton.png)no-repeat;   
border: 0px solid #000000;}

/* Hover-Button */
##access li a:hover  {
width: 185px !important;
height: 40px !important;
font-family: balthazar !important;
font-size: 18px !important;
color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
background-color:transparent !important; 
background-image:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton-hov.png)no-repeat;
border: 0px solid #000000;}

/* aktuell besuchte Seite */
##checked_menu a {
width: 185px !important;
height: 40px !important;
font-family: balthazar !important;
font-size: 18px !important;
color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
background-color:transparent !important;
background-image:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton-hov.png)no-repeat;}

/* Unterseiten */
#access ul ul li a {
width: 185px !important;
height: 40px !important;
font-family: balthazar !important;
font-size: 18px !important;
color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
background-color:transparent !important;
background-image:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton.png)no-repeat;
border: 0px solid #000000;}

/* Unterseiten-Hover */
#access ul ul li a:hover {
width: 185px !important;
height: 40px !important;
font-family: balthazar !important;
font-size: 18px !important;
color: #ffffff !important;
text-decoration: none;
text-align: left !important;
padding-left: 20px; 
background-color:transparent !important;
background-image:  url(http://img.webme.com/pic/g/globe-testseite/garnbutton-hov.png)no-repeat;
border: 0px solid #000000;}

______________
mfG design-globe


Zuletzt bearbeitet von design-globe am 26.07.2016, 05:55, insgesamt 2-mal bearbeitet
↑
Beitrag08.08.2016 um 18:51 (UTC)    
Titel:
Antworten mit Zitat
push

leider besteht das Problem nach wie vor und es sind zwei weitere dazugekommen

1. hier auf meiner Testseite Arrow http://globe-testseite.de.tl/ habe ich den zweiten Button in der Navi als "Menüpunkt ohne Link" eingestellt im Editor, wieso zum Geier wird die Schrift so mini Question

2. ist der Copyrighthinweis im Footer komischerweise mit dem "nach oben"-Button verlinkt, wat is da nu los Question

wäre echt super, wenn sich ein Design-Clean-Profi mit mir auf die Fehlersuche begibt

danke
______________
mfG design-globe


Zuletzt bearbeitet von design-globe am 09.08.2016, 03:44, insgesamt einmal bearbeitet
↑
Beitrag10.08.2016 um 09:26 (UTC)    
Titel:
Antworten mit Zitat
Moinsen,
zu Punkt 2: Du hast vergessen ein <a href> Tag zu schliessen.
Code:
<div id="nach_oben"><a href="#">nach oben</div>

zu Punkt 1: versuch mal den Menüpunkt folgendermaßen anzusprechen:
Code:
ul.main-menu li u {
    font-size: 20px;
}

Schriftgröße musst du nach Bedarf anpassen.
______________
mfg SEO


Zuletzt bearbeitet von seo-suchmaschinenoptimierung am 10.08.2016, 10:31, insgesamt einmal bearbeitet
↑
Beitrag10.08.2016 um 09:48 (UTC)    
Titel:
Antworten mit Zitat
moin seo,

danke, aber das erste kapier ich nicht, denn genauso ist der Code bei mir drin ----Rolling Eyes

seo-suchmaschinenoptimierung hat Folgendes geschrieben:
Moinsen,
zu Punkt 2: Du hast vergessen ein <a href> Tag zu schliessen.
Code:
<div id="nach_oben"><a href="#">nach oben</div>


...und das funktioniert auch nicht
seo-suchmaschinenoptimierung hat Folgendes geschrieben:
zu Punkt 1: versuch mal den Menüpunkt folgendermaßen anzusprechen:
Code:
ul.main-menu li u {
    font-size: 20px;
}

______________
mfG design-globe
↑
Beitrag10.08.2016 um 11:30 (UTC)    
Titel:
Antworten mit Zitat
Dein Code:
<div id="nach_oben"><a href="#">nach oben</div>
der richtige Code
<div id="nach_oben"><a href="#">nach oben</a></div>

Das andere schau ich mir gleich nochmal an.

edit
Du hattest den Menüpunkt ohne Link zuerst unterstrichen dargestellt, das ist jetzt weg, darum greift das CSS so nicht mehr ( das u hinter dem li ).

Vorher:
Code:
ul.main-menu li u {
    font-size: 20px;
}


Jetzt:
Code:
.main-menu > li {
    font-size: 20px;
}


Damit sollte es nun gehen.
______________
mfg SEO


Zuletzt bearbeitet von seo-suchmaschinenoptimierung am 10.08.2016, 12:36, insgesamt einmal bearbeitet
↑
Beiträge der letzten Zeit anzeigen:   
  • Seite 1 von 1

  •  
    • Gehe zu:  


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de

© 2024 webme GmbH, Deutschland. Alle Rechte vorbehalten.