Grafig Kopfzeile einbinden

wildstier · #1 (**permalink**) 13.07.2011, 20:38

Habe folgendes Problem:

Ich habe eine Seite erstellt mit html und css mit Kkopf und Fusszeile. Leider bekomme ich weder mit css (erkennt meine höhen- und breitenangaben nicht an) noch mit html-code das zweite Bild entsprechend in die Kopfzeile eingebunden. Das eine Bild läuft rechts (ist in Ordnung und gewollt) das zweite linksbündige Bild aber hat einen Abstand vom Rahmen und lässt sich nicht ohne einbinden. Kann mir jemand eine saubere Lösung anbieten? Danke im voraus.

<body>

<div id="Seite"><img src="ich1.jpg" width="70" height="80" alt="ich" border="0" align="right" hspace="3" vspace=3" title="ich">
<h1><img src="muenze.gif" width="70" height="80" alt="goldtaler" border="0" align="left" hspace="-3" vspace=0" title="goldtaler"> Mal schauen wie es nun aussieht</h1>

Setze ich das zweite Bild aus h1 tag raus kommt es nicht mehr in die Kopfzeile

Manfred62 · #2 (**permalink**) 13.07.2011, 21:10

Stell das online, bzw. liefer mehr Informationen.

Manfred

wildstier · #3 (**permalink**) 13.07.2011, 21:40

HTML-Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>ich</title>
<link rel="stylesheet" type="text/css" href="stiehl.css">

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">

<body>

<div id="Seite"><img src="ich1.jpg" width="70" height="80" alt="ich" border="0" align="right" hspace="3" vspace=3" title="ich">
<h1><img src="muenze.gif" width="70" height="80" alt="ich" border="0" align="left" hspace="-3" vspace=0"  title="ich">                                       Mal schauen wie es nun aussieht</h1>



<ul id="Navigation">
<p class="linkboxaktiv">Willkommen</p>
<li><a href="europa.html">Europa</a></li>
<li><a href="usa.html">USA</a></li>

<li><a href="email.html">Kontakt</a></li>
<li><a href="zugang.html">Gesicherter Bereich<title="Hier kommen sie in den Gesicherten Bereich. Um hier herein zu kommen müssen Sie einen Zugangcode beantragen, den wir Ihnen binnen 24 Stunden zusenden werden.></title></a></li>
</ul>

<div id="Inhalt">
<h2><u>Willkommen</u></h2>
<p> <i><b><u>Sie</u></b></i>  <i><b><u></u></b></i>  <i><b><u>15</u></b></i> 
<h5><u></u></h5>
</p>

<h2><u></u></h2>
<br>

<li></li>
<li></li>
<li></li>

</div>

<p id="Fusszeile">Dies Fusszeile stellt innerhalb des Umschließenden Divs Elementenfluss wieder her</p>
</div>
</body>





</html>

Code:

/*eigener Versuch*/
body {

background-color: #FFD700;
font-family: Arial, Verdana, sans-serif, Courier; color: green; font-size: 101.01%;
Margin: 0px; padding: 0,3em; min-width: 41em; text-align: center; /*Centrierung im IE */
}



div#Seite {
text-align: left;
margin: 0 auto;
padding: 0;
width: 1060px;
border: 3px ridge silver;

 }
h1 {
font-family: Verdana, Arial, Courier, sans-serif; font-size: 2.3em; color: blue; text-align: center;
margin: 0 0 1em; padding: 0.3em;
border: 3px solid #66CDAA;

}

ul#Navigation {
font-size: 0.13em;
float: left; /*width: 19em;*/
margin: 0 0 0.2em; padding: 0.1em;
border: 3px dashed #000000;
text-align: center;

}

ul#Navigation li {
list-style: none;
margin: 0; padding: 0.5em;


/*kein Border da die Links in der Navileiste umrahmt werden */
}

ul#Navigation a {
display: block;
padding: 0.2em;
font-weight: bold;
font-size: 17px;
margin: 0.3em;
text-decoration: none;

}
 ul#Navigation a:link {
color: #ffffff; background-color:#daa520;

}

ul#Navigation a:visited  {
color: #ffffff; background-color: #b8860b;

}

ul#Navigation a:hover  {
color: black; background-color: silver;

}

ul#Navigation a:active  {
color: white; background-color: #00BFFF;  
font-size: 8.5em;
}

div#Inhalt   {
margin: 0 0 1em 190px;
padding: 0 1em;
}

/* Haupspalte */
* html div#Inhalt  {
height: 3em; /*Workaround gegen 3-Pixel-Bug des Internet Explorer bis Version 6 */
margin-bottom: 0;
border: 3px dashed #000000;
}

div#Inhalt h2 {
font-size: 1em;
margin: 1em 0;
color: navy;
}

div#Inhalt p {
font-size: 1em;
margin: 1em 0;
}

p#Fusszeile  {
clear: both;
font-size: 0.53em;
margin: 0; padding: 0.1em;
text-align: center;
background-color: #fed;
border: 1px solid silver;
}

/* hier muss noch Linkboxaktiv hin!! */
/*eigener Versuch*/
.linkboxaktiv {
font-family:  Helvetica, Arial, sans-serif, Verdana;
font-style: italic;
font-weight: bold;
font-size: 10em;
text -decoration: underline; 
background-color: #ffa500; }

K.Roland · #4 (**permalink**) 15.07.2011, 22:35

Zitat:

Zitat von wildstier
Ich habe eine Seite erstellt mit html und css mit Kkopf und Fusszeile. Leider bekomme ich weder mit css (erkennt meine höhen- und breitenangaben nicht an) noch mit html-code das zweite Bild entsprechend in die Kopfzeile eingebunden. Das eine Bild läuft rechts (ist in Ordnung und gewollt) das zweite linksbündige Bild aber hat einen Abstand vom Rahmen und lässt sich nicht ohne einbinden. Kann mir jemand eine saubere Lösung anbieten? Danke im voraus.

1.Beispiel

Code:

html, body, div, h1 { margin: 0; padding: 0; }
html { height: 100%; }
body {
  font: 100.1% Verdana, Geneva, Arial, Helvetica, sans-serif; 
  padding-top: 20px;
  text-align: center;
}
#seite {
  text-align: left;
  margin: 0 auto;
  width: 1060px;
  border: 3px ridge silver;
}
* html #seite { width: 1066px; }

#header { 
  background: #ffd700 url( ... ) no-repeat right top; /* ich1 Grafik */
  border: 3px solid #66CDAA; 
  color: blue; 
  text-align: center;  
}
#header h1 { 
  background-image: url( .... );  /* muenze.gif */
  background-repeat: no-repeat;
  background-position: left top;
  font-size: 2em; 
  margin-right: 70px;
  padding: 15px 0px 15px 70px;  
}

HTML-Code:

</head>
<body>

<div id="seite">
<div id="header">
<h1>Mal schauen wie es nun aussieht</h1>
</div>
</div>

</body>
</html>

Pixel in EM mußt du richtig umrechnen! u.s.w.
Besuche auch mal den Validator!

Gruß,
Roland

wildstier · #5 (**permalink**) 16.07.2011, 17:17

Danke für deine Antwort. Ich bin gerade am versuchen, aber anscheinend mache ich noch immer was verkehrt. der Vladitor hatte ich besucht und der zeigte mir keine Fehler an

Manfred62 · #6 (**permalink**) 16.07.2011, 18:05

Zitat:

Zitat von wildstier

...der Vladitor hatte ich besucht und der zeigte mir keine Fehler an ...

Wenn ich deine HTML-Datei teste, nennt der Validator mir 10 Fehler!
Stell das mal online, damit man auch die Bilder sieht.

Fürs Grundlagen lernen --> Little Boxes

Manfred

wildstier · #7 (**permalink**) 16.07.2011, 18:12

Hi,

wie kann ich es hier reinstellen? Habe mittlerweile soviel Versuche es zu ändern dass sich inzwischen einige Fehler eingeschlichen haben können. Ist halt lange her wo ich mit sowas arbeitete

Aber als ich es auf der deutschen Seite überprüfte zeigte es mir keinen Fehler an. Naja mal schauen ob ich nicht besser mit Table arbeite und es so hin bekommen kann

Manfred62 · #8 (**permalink**) 16.07.2011, 18:25

Zitat:

Zitat von wildstier

wie kann ich es hier reinstellen?

Nimm dir einen Freehoster und lad dort alles hoch.
Den Link zu deiner Seite dann hier posten.

Werbefreie Freehoster:
Byethost
bplaced

Den Little Boxes Link bitte trotzdem durcharbeiten (im eigenen Interesse)

K.Roland · #9 (**permalink**) 17.07.2011, 11:18

Hallo,

habe deine PN gelesen.
Ich hatte Gestern in meinem Beispiel einen Fehlen eingebaut (Heute geändert).
Sorry
Hier war der Fehler von mir:

Code:

background: #ffd700 url( ... ) no-repeat left top; /* ich1 Grafik */

Zitat:

Zitat von wildstier
Naja mal schauen ob ich nicht besser mit Table arbeite und es so hin bekommen kann

Keine Tabelle!
Nicht gleich aufgeben.

Gruß,
Roland

wildstier · #10 (**permalink**) 18.07.2011, 10:09

Hallo Roland, besten dank. Im Moment lerne ich wieder

Der eine Link zu einem Buch war super, auch wenn nicht gleich alles funktioniert. Aufgeben tu ich nie, wird schon werden denke ich. Wenn ich es geschafft habe stelle ich es gern hinein

Nochmals danke

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
html/css in PHP per include einbinden? <- Problem schon gelöst!	purzel80	CSS	6	22.11.2010 15:10
Einbinden der CSS-Dateien im Header	Carolin	(X)HTML	9	15.01.2009 15:44
fixierte Kopfzeile	kayleigh	CSS	0	30.04.2007 17:55
wie kleinere Flashanimation einbinden	nele	Barrierefreiheit	7	29.05.2006 10:54
Stylesheets: Wie am besten Einbinden??	Phil	(X)HTML	8	06.08.2004 22:56