Beiträge von PepeLePew74

PepeLePew74

Ich habe das jetzt so mit deinem Tip hinbekommen aber das menue ist jetzt riesig und auch nicht als schönes dropdown sondern schaut ziemlich wild aus.

ich kenne halt diese üblichen parameter wie abstände und so...

PepeLePew74

und dann kann ich das menue noch über die bekannten parameter anpasse oder?

PepeLePew74

Danke werde ich mal versuchen... Aber du hast recht ich hab das mit den <ul> und <li> durch die punkte übersehen

PepeLePew74

Hallo,

ich habe eine Site übernommen und soll dort das Menü anpassen. Leider habe ich zu meinem Vorgänger keinen Kontakt und ich schaffe es einfach nicht das Menü so verstecken das es bei der Maus Hover aufgeht und ansonsten weg ist:

Der html teil ist so:

<a href="index.html">PROJEKTE</a>

<ul>

<li>Im Großen Raum</li>

<ul>

</ul>

<li>Im Freiraum</li>

<li>Im Innen Raum</li>

<li>Im kleinen Raum</li>

</ul>

</li>

</li>

<a href="kontakt.html">KONTAKT</a>

</li>

<a href="impressum.html">IMPRESSUM</a>

</li>

</ul>

</div>

In der CSS sieht es aktuell so aus und ich komme einfach nicht auf die Lösung:

/* FONTS */

@font-face {

font-family: NeutraDisplayBold;

src: url('fonts/NeutraDisplay-Bold.otf') format('opentype');

}

@font-face {

font-family: NeutraDisplayMediumAlt;

src: url('fonts/NeutraDisplay-MediumAlt.otf') format('opentype');

}

@font-face{

font-family: "AvantGardeGothicITC W01 Book";

src:url("fonts/5390730/a98bdca9-ab20-41a6-98f3-ed6bb54ed69e-.eot#iefix");

src:url("fonts/5390730/a98bdca9-ab20-41a6-98f3-ed6bb54ed69e-.eot#iefix") format("eot"),url("fonts/5390730/5b13893e-ac07-4b49-b0e4-355de4e4df8d.woff2") format("woff2"),url("fonts/5390730/a9e70966-2348-4c54-ace1-7f809fcee055.woff") format("woff"),url("fonts/5390730/9cb9e06e-0507-4768-ad8f-cba7f3ec98b6.ttf") format("truetype");

}

body {

background-color: white;

font-family: "AvantGardeGothicITC W01 Book";

}

.navbar, .projekte, .right_caption, .rechts, .textbox, .letter_spacing, .impressum-container h2 {

font-family: NeutraDisplayMediumAlt;

letter-spacing: 2px;

}

h1 {

font-family: NeutraDisplayBold;

line-height: 1.4em;

}

.container, .container-fluid {

width: 90%;

max-width: 1000px;

padding-top: 35px;

}

.size_logo {

width: 130px;

}

a {

color: black;

}

a:hover {

color: grey;

}

.w3-badge {

height: 13px;

width: 13px;

padding: 0;

}

ul {

padding-left: 0;

list-style-type: none;

overflow: hidden;

background-color: white;

}

li {

float: left;

margin-top: 46px;

color: red;

list-style-type: none;

position: relative;

}

li a {

display: block;

color: black;

text-align: center;

padding: 50px 16px;

text-decoration: none;

}

li a:hover:not(.active) {

background-color: white;

color: black;

}

.active {

color: black;

background-color: white;

text-decoration: underline;

}

.w3-container {

float: none;

}

.underconstruction div {

padding-left: 0;

padding-right: 0;

font-size: 3em;

margin-top: 10%;

text-align: right;

letter-spacing: 2em;

text-transform: uppercase;

line-height: 1.3em;

}

.padding {

padding-left: 15px;

}

.termine {

text-align: right;

padding-left: 250px;

padding-top: 100px;

}

div {

font-size: 100%;

}

@media screen and (max-width: 600px) {

ul.topnav li.margin, ul.topnav li {

margin-top: 0;

float: left;

}

/* impressum */

.impressum-container {

font-size: 0.7em;

}

.impressum-container h2 {

letter-spacing: 2px;

font-size: 1.2em;

}

.impressum-container h3 {

font-size: 0.9em;

text-decoration: underline;

padding: 0;

letter-spacing: 1px;

}

.impressum {

float: right;

width: 120px;

}

/* rechter rand */

.rechts {

text-align: right;

padding-left: 0;

float: right;

}

.rechts-unten {

text-align: right;

vertical-align: text-bottom;

}

.rechts .text {

margin-top: 50px;

margin-bottom: 20px;

letter-spacing: 2px;

}

.rechts .gelberstrich {

position: absolute;

;

right: 0;

}

.gelberstrich {

background-color: #ffff1f;

width: 60px;

height: 0.7em;

margin: 15px;

}

/* Kontakt */

.textbox {

background-color: #ffff1f;

color: black;

border: none;

padding: 15px 25px 30px 25px;

margin-bottom: 20px;

}

.textbox .line {

height: 1px;

background-color: black;

width: 100%;

}

.textbox input, .textbox textarea {

width: 100%;

margin-top: 20px;

margin-bottom: 0;

padding: 0;

}

.textbox .send {

width: auto;

background-color: #ffff1f;

border: none;

text-decoration: underline;

text-transform: uppercase;

}

.textbox textarea {

background-color: #ffff1f;

border: none;

}

.g-recaptcha {

margin-top: 20px;

}

::-webkit-input-placeholder {

color: black;

}

:-moz-placeholder {

/* Firefox 18- */

color: black;

}

::-moz-placeholder {

/* Firefox 19+ */

color: black;

}

:-ms-input-placeholder {

color: black;

}

/* Projektseiten */

.ueberschrift_messestand {

padding-bottom: 30px;

padding-top: 0;

letter-spacing: 4px;

}

.carousel {

margin: 0 15px;

}

.carousel-control.left, .carousel-control.right {

background-image: inherit;

}

.carousel-control .glyphicon {

position: absolute;

top: 50%;

z-index: 5;

display: inline-block;

}

.carousel-control .glyphicon:before {

padding: 10px;

background-color: white;

}

.carousel-control.right .glyphicon {

right: -1px;

}

.carousel-control.left .glyphicon {

left: 0;

}

.glyphicon {

background-color: white;

color: black;

}

.right_caption {

text-align: right;

margin: 0 15px;

text-transform: uppercase;

margin-bottom: 4px;

}

/* Navbar */

.navbar {

background-color: inherit;

border: inherit;

padding-bottom: 60px;

}

.navbar-right {

padding-right: 0px;

}

.navbar-header {

padding-left: 15px;

}

.navbar-nav {

padding-top: 18px;

}

.navbar-default .navbar-nav>li>a {

color: black;

}

.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover {

background-color: inherit;

color: black;

}

@media (max-width: 768px) {

.navbar-collapse {

margin-top: 0;

border: inherit;

position: relative;

top: -40px;

}

.nav li {

width: 100%;

margin: 0;

}

.navbar-collapse, .navbar-collapse.in {

overflow-y: inherit;

}

.navbar {

padding-bottom: 0;

margin-bottom: 0;

}

.navbar-nav {

padding-top: 10px;

width: 100%;

margin: 0;

}

.navbar-brand {

height: auto;

}

.navbar-toggle {

top: -60px;

z-index: 10;

}

/* Ueber Mich */

.img-responsive {

width: 970px;

display: block;

margin: 0;

border: 0;

}

.ueberschrift_angelika {

padding-bottom: 30px;

padding-top: 30px;

letter-spacing: 4px;

}

h1 {

padding-top: 5px;

color: black;

font-size: 180%;

}

/* Footer */

.icons {

float: right;

padding-right: 15px;

position: relative;

top: 0;

}

.icons.top {

top: -20px;

}

.icons.contact {

margin-top: 30px;

padding: 0;

width: 100%;

margin-bottom: 60px;

}

/* Projekte */

.projekte {

margin-top: 50px;

}

.projekte .image {

float: right;

position: relative;

top: -40px;

padding-bottom: 50px;

padding-right: 15px;

}

.projekte h4 {

float: right;

transform: rotate(270deg);

position: relative;

top: 0px;

right: 12px;

transform-origin: 100% 0;

font-size: 0.8em;

margin: 0;

line-height: 1em;

color: black;

letter-spacing: 2px;

}

.projekte .element {

padding-bottom: 15px;

}

.projekte .element img {

padding-right: 20px;

width: 100%;

position: relative;

top: -1em;

}

.container.head {

padding-bottom: 40px

}

Ich hoffe mir kann jemand helfen

vielen dank

Beiträge von PepeLePew74

Menü lässt sich per css nicht steuern

Menü lässt sich per css nicht steuern

Menü lässt sich per css nicht steuern

Menü lässt sich per css nicht steuern