nicht angemeldet
hallo , ich habe meine Links spalte die bevor auf meine Linke seite war , nach nav gebracht.. , das Probleme ist , wenn der Maus auf Computer , der Hover , tut etwas komische... , wie sie aussiehst...
mein Html Code;
<body>
<header></header>
<nav id="navs">
<ul>
<li><a href="index.php">Home</a></li>
<li><a href="about_us.php">About Us</a></li>
<li><a href="contact.php">Contact</a></li>
<li class="dropdown">
<a href="#" class="dropbtn">Computer</a>
<div class="dropdown-content">
<a href="windows.php">Windows</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
</div>
</li>
<li><a href="#">News</a></li>
<li><a href="#">Bucher</a></li>
</ul>
</nav>
<aside></aside>
<main>
<h4>Das letzte von Windows 8</h4>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.Consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam .
</p>
<a style="text-decoration: none;" href="windows8.php">Read more...</a>
<br>
<br>
<br>
<br>
<br>
</main>
<aside id="furtherInformation"></aside>
<footer id="copry" >
<p>My Website: Computer and More © 2018. All Rights Reserved.</p>
<a id="img1" href="https://creativecommons.org/licenses/by-nc/4.0/">
<picture>
<source media='(max-width: 30em)' srcset='/Bilder/copry-kleine.png'>
<source media='(max-width: 35.5em) and (orientation: landscape)' srcset='/Bilder/copry-kleine.png'>
<source media='(min-width: 80em)' srcset='/Bilder/f601296864.png'>
<img alt="Creative Commons License" src="/Bilder/copry.png" style="width:auto;"></a>
</picture>
<p>This work is licensed under a Creative Commons Attribution-NonCommercial 4.0 International License.
Content of this site cannot be republished either online or offline without our permissions. </p>
</footer>
Der Css code:
/* Nav */
nav {background-color: #d2f5c4;}
nav a{
color: black;
text-decoration: none;
display: inline;
padding: 0px 8px;
font-size: 16px;
font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, sans-serif;
margin: 10px;
}
nav ul {list-style-type: none;}
nav li {display: block; display:inline-block;}
/* arbeit */
.dropdown a {
display: block;
padding: 0px 0px 0px 500px;
color: #000;
font-size: 17px;
}
/* arbeit */
li a:hover, .dropdown:hover .dropbtn {
background-color: #f1ebeb;
}
.dropdown-content {
display: none; /* display wird ausgeschaltet ,aber erlaubt die anderen elemente, position ,background ,.... */
font-size: 12px;
position: absolute; /* die stellung folgt der Erste Link(li) */
background-color: #f1f1f1 ;
min-width: 10px; /* macht größer die Inneren Links */
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); /* Bau ein Schatte und geben an dem Schatten Farbe */
z-index: 1; /* Zeigen die Ordnung wie die Links gezeigt werden... */
}
.dropdown-content {
color: black;
padding: 8px 10px 8px 1px;
text-decoration: none; /* Bekomme die Liks keine Unten Stricht ....*/
}
.dropdown-content a:hover {
background-color: #9f9e9e;
}
/* Offnen die Innere Links */
.dropdown:hover .dropdown-content {
display: block;
left: 1px; /* zeigt wo dem innere link fenster gezeigt wird */
top: 10px; /* zeigt wo dem innere link fenster gezeigt wird */
}
/* Main */
input, textarea{
background:rgba(220,220,220,0.75);
border:1px solid rgba(220,220,220,0.75);
font:inherit;
border-radius:0.2941em;/*5px;*/
padding:0.4118em;/*7px;*/
/*farbigen Rahmen in Chrome und Safari abschalten.*/
outline:none;
}
input:focus, textarea:focus{
background:#fff;
border:1px solid #000;
outline: none; /* einige Browser add line auf input , das verhindert es... */
}
input[type=submit]{
background:#be633c;
border:none;
color:#fff;
border-radius:50% 50%;
box-shadow:inset 0 0 1em #fb9d23;
padding:0.5882em;/*10px*/
}
input[type=submit]:focus, input[type=submit]:active{
background-color:#A33202;
}
/* Footer */
#copry {
overflow: auto;
font-size: 10px;
list-style-type: none;
font-family: Candara, Calibri, Segoe, "Segoe UI", Optima, sans-serif;
}
#img1 {float: left; margin: 5px; }
#copry a {text-decoration: none; margin-bottom: 3px;}
#copry p {font-size: 10px; margin-bottom: 0px; }
/* Getting your footer under control */
#content-wrap {
padding-bottom: 2.5rem; /* Footer height */
}
/* Komment Button */
#comment:hover { box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);}
#comment {font-size: 11px;} /* Button from comment */
#form {font-size: 14px;} /* size from comment window */
kann Bitte jemand hilfe... , Viel Danke !
akzeptierte Antworten
Probleme mit Nav
Rolf B
Bewertung: keine Bewertung
Matthias Apsel
Gunnar Bittersmann