Problem mit HTML sowie CSS
David _S
- css
- html
- html
0 Auge- css
- html
0 Davd_S0 gernotback
Hallo, ich habe seit heute wo ich ein mitlaufender Kopf sowie ein mitlaufendes Menüband habe ein Problem. Im Kopf/Überschrift ist ein Bild, die von einer Box umgeben ist. Die Box wird aber bis zum Rand nach Rechts gezogen. Hier was in der CSS steht:
[#]kopf {
width: auto;
height: 70px;
background-color: #FAF9F8;
margin: 0px 0px 15px 0px;
padding: 0px 15px 0px 15px;
box-shadow: 2px 2px 2px 0px #515151;
-moz-box-shadow: 2px 2px 2px 0px #515151;
-webkit-box-shadow: 2px 2px 2px 0px #515151;
overflow: hidden;
position: fixed;
top: 1rem;
border-color: #FFF;
}
Und hier die HTML:
<div id="kopf">
<h1><a href="index.html">
<img src="bilder/logo.png" alt="Logo" width="50%" height="50%"></a></h1>
</div>
Vielen Dank im voraus David
Hallo
In einm Wort: Was?
Kannst du bitte dein Anliegen ausführlicher beschreiben? Nicht nur was ist, sondern auch was soll. Danke.
Tschö, Auge
Also die Webseite hat so fürher ausgesehen: Nachdem ich den Mitlaufenden Kopf sowie das Mitlaufende Menü gemacht habe schaut es so aus:
Ich hätte es gerne das es wie früher aussieht.
David
Hallo
Hatte #kopf
schon immer die Breitenangabe width: auto;
? Bedenke bitte, dass sich ein Blockelement immer die verfügbare Breite einverleibt. Und rechts war halt noch Breite übrig. Eventuell ist auch die grundsätzliche Beschränklung der Breite des Elternelements sinnvoll. Um das einschätzen zu können, muss aber der vollständige HTML- und CSS-Quelltext zugänglich sein. Am besten geht das per Link auf eine strukturell vollständige Beispielseite.
Tschö, Auge
Hab nun eine Beispielseite gemacht. Sie ist unter Link erreichtbar.
Hallo
Hab nun eine Beispielseite gemacht. Sie ist unter Link erreichtbar.
Ok, die Breite des Headers (#kopf
) – der übrigens tatsächlich ein <header> sein darf – scheint mittlerweile zu passen.
Der Container der Navigation (#menu
) hingegen – er möchte übrigens gern ein <nav> sein – hat allerdings widersprüchliche Angaben. Er wird gefloatet und fest positioniert. Ich vermute, die Navigation soll an Ort und Stelle bleiben, womit position: fixed;
die richtige Wahl wäre.
Soweit erstmal dazu.
Tschö, Auge
Hallo David,
<div id="kopf"> <h1><a href="index.html"> <img src="bilder/logo.png" alt="Logo" width="50%" height="50%"></a></h1> </div>
Was gibt es denn für Vorfahrenselemente deines DIV-Elements mit der ID="kopf"?, die in deiner vorigen Version, bei der du noch nicht mit "postion:fixed" gearbeitet hast, möglicherweise den Abstand erzeugt haben, der jetzt fehlt? Vielleicht solltest du diesem abstandsgebenden Vorfahrenselement ein "position:relative" spendieren, damit sich das Kopf-Element, das jetzt "position:fixed" hat, auch weiterhin an diesem Vorfahrenselement und nicht am Viewport ausrichtet.
Gruß Gernot