Juergens-Workshops.de Forum
Ansicht auf anderenm Bildschirm - Druckversion

+- Juergens-Workshops.de Forum (https://forum.juergens-workshops.de)
+-- Forum: HTML und Co (https://forum.juergens-workshops.de/forumdisplay.php?fid=62)
+--- Forum: Rund um HTML (https://forum.juergens-workshops.de/forumdisplay.php?fid=83)
+--- Thema: Ansicht auf anderenm Bildschirm (/showthread.php?tid=30124)

Ansicht auf anderenm Bildschirm - Onkel - 02.03.2010

Hallo schon wieder ich,

ich habe meine Website auf einem 23 Zoll 16:9 Rechner erstellt und da sieht die Seite so aus:

[Bild: Y4p17912.jpg]

Nun habe ich das Ergebnis auf meinem Laptop getestet und hatte dieses Bild:

[Bild: RnR18008.jpg]

Ich bedanke mich für eure Hilfe

Onkel

Das css sieht so aus:


Code:
*{
  margin:0px:
  padding: 0px;
}

body  {
    font-family: "Trebuchet MS", "Bitstream Vera Sans", "Helvetica", sans-serif
    font-size: 10pt;
    background-color: #ffdca6;
    background-image: url(../Bilder/Blattneu.jpg);
    background-repeat: repeat-y;
    background-position: center;

}



p   {
    line-heiht:140%;
    text-align: justify;
}



h1,h2,h3,h4,h5,h6  {

    color: #f3ffbf;
    border-bottom: 1px solid #f3ffbf;
    font-family: "Western" sarif;
}



#Kopfbild   {

     margin: 20px 0px 0px 46px;

}

#Navigation ul li a {

    text-decoration: none;

}


#Navigation  ul  li{
    float: right;
    padding-right: 8px;
    display: inline;
    margin: 0px 0px 20px 0px;

}




#Hauptcontainer {

     width: 980px;
     margin: 0px 0px 0px 387px;

}


#Einzugcontainer {
    margin: 0px 0px 0px 127px;

}

#Copyright  {

     clear: both;
     border-top: 1px solid #f3ffbf;
     padding-top: 10px;
     text-decoration: none;
}


#Copyright  p.link-rechts {

    float: right;
}


Ansicht auf anderenm Bildschirm - Seramis - 02.03.2010

Dazu müsste man die html Datei dann auch sehen.
Was wo in welchen Container gepackt wurde....

Wenn du magst, kannst mir auch den Link zu der Seite per PN schicken, dann kann ich mal nachgucken was da los ist.

Ansicht auf anderenm Bildschirm - Onkel - 02.03.2010

Hier die html,

die Seite steht noch nicht im Netz da ich noch nicht weiß zu welchem Anbieter ich gehe und ich nicht weiß was der Server alles können muss muss.

[HTML]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//DE" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Melanie´s Wild River Reitstall</title>
<meta name="description" content="Meine Pferde">
<meta name="keywords" content="Reiten, Westerpferde, Pferde">
<meta name="author" content="Norbert">
<meta name="editor" content="html-editor phase 5">

<link rel="stylesheet" type="text/css" media="screen" href="screen.css">




</head>

<div id="Hauptcontainer-zwei">


<div id="Kopfbild">

<img src="../Bilder/Kopfbild-neu.png" alt="Kopfbild"/>

</div>

<div id="Navigation">

<ul>

<li><a href="Impressum">» <img src="../Bilder/Navi-Impressum.png" alt="Impressum" border="0" width="121" height="63"></a></li>
<li><a href="Kontakt">» <img src="../Bilder/Navi-Kontakt.png" alt="Kontakt" border="0" width="121" height="63"></a></li>
<li><a href="Fotogalerie">» <img src="../Bilder/Navi-Fotogalerie.png" alt="Fotogalerie" border="0" width="121" height="63"></a></li>
<li><a href="Wissenswertes.html">» <img src="../Bilder/Navi-Wissen.png" alt="Wissenswertes" border="0" width="124" height="63"></a></li>
<li><a href="Meine Pferde.html">» <img src="../Bilder/Navi-Meine-Pferde.png" alt="Meine Pferde" border="0" width="121" height="63"></a></li>
<li><a href="index.html">» <img src="../Bilder/Navi-Über-mich.png" alt="Über mich" border="0" width="121" height="63"></a></li>



</ul>

</div>

<div id="Einzugcontainer">


<div id="Copyright">

<p class="link-rechts" ><a href="#" style=>Impressum</a></p>
<p>Copyright © 2010 Norbert Peters</p>

</div> <!--raus aus dem Copyright Container -->


</div> <!--raus aus dem Einzugcontainer Container -->


<div id="Fusszeile">


<img src="../Bilder/Fussbild.png" alt="Fussbild"/>

</div> <!--raus aus dem Fusszeile Container -->


</div> <!--raus aus dem Hauptontainer -->






</body>

</html>[/HTML]

Ansicht auf anderenm Bildschirm - Seramis - 02.03.2010

Hallö,
es fehlt der <body> Start TAG

dann hast du einen Container Namens div id="Hauptcontainer-zwei", der aber in der CSS nicht definiert ist, dort gibt es nur #Hauptcontainer.
Also wieder in Hauptcontainer ändern.

Dann benutzt du bei den Überschriften den Font "Western" ( es heißt übrigens serif nicht sarif ;-) )
Diese Schrift erscheint nur bei den Leuten, die genau diese Schrift auch auf ihrem PC installiert haben, alle anderen sehen diese Schrift nicht, sondern die einfache Schrift Trebuchet MS.
Das ist nunmal so, deshalb sind Inhaltstexte in "Schmuckschriften" nicht wirklich sinnvoll. Sieht bei dir toll aus, aber alle die sie nicht haben... nun ja.

Dann solltest du dir gleich angewöhnen, alles klein zu schreiben beim Programmieren.
Schon wenn du Bilder fürs Web abspeicherst, benenne sie in kleinbuschstaben und ohne Umlaute!
Es erspart dir viel Kummer wegen der Fehlersuche nach falschgeschriebenen Worten und ist beim Programmieren von xhtml sowieso Standard. (kommt in diesem Falle ja aber nicht zum Tragen.)

Ansicht auf anderenm Bildschirm - Onkel - 02.03.2010

Hm ja,

das ist vom Experimentieren übrig geblieben der "Hauptcontaine-zwei. Was ist der body Start Tag kam ich damit das verrutschen der Kopf und Fussgrafik verhindern?

LG
Onkel

Ansicht auf anderenm Bildschirm - Helmut - 02.03.2010

@Onkel,

sei bitte so nett und setze Code in die dafür vorgesehenen BB-Code Tags.

Cu Helmut

Ansicht auf anderenm Bildschirm - Seramis - 02.03.2010

Es fehlt <body> , nach dem </head>.

Der Inhalt muss immer Zwischen zwei Body Tags stehen

<body>

dein Inhalt

</body>

Ansicht auf anderenm Bildschirm - Beagle - 02.03.2010

Seramis schrieb:Diese Schrift erscheint nur bei den Leuten, die genau diese Schrift auch auf ihrem PC installiert haben, alle anderen sehen diese Schrift nicht, sondern die einfache Schrift Trebuchet MS.
Das ist nunmal so, deshalb sind Inhaltstexte in "Schmuckschriften" nicht wirklich sinnvoll. Sieht bei dir toll aus, aber alle die sie nicht haben... nun ja.


Das soll nur noch teilweise stimmen, bzw. nur noch ältere Browser betreffen. In CSS gäbe es eine
Code:
@font-face {...}
Lösung, alternativ die dynamische Schriftersetzung mittels/nach Cufon.

Kommerziell wäre da noch TYPEKIT.

Gewerkelt haben ich mit diesen Dingen noch nicht, deshalb kann noch wenig dazu sagen, nur prinzipiell ist die Verwendung eigener Fonts und die Anzeige im Browser möglich.

Ansicht auf anderenm Bildschirm - Onkel - 03.03.2010

Da ich den Fehler nicht finden kann habe ich die HP mal Hochgeladen.

http://onkel22.on.funpic.de/index.html

mfg
Onkel

Ansicht auf anderenm Bildschirm - Helmut - 03.03.2010

...
das passt alle nicht zusammen, deine Grafik oben ist 1.014 px, der Hauptcontainer soll aber nur 980 ein und auch noch ein margin-left von 387 annehmen. Da kommt dann nur Quark bei raus.

Ich hab das mal ein wenig angepasst und hier hochgeladen:
http://www.linkfile.de/download-fa385fb5a8e79b41a0d37b12c9f95996.php

Löschlink, nur nutzen nach dem Download
http://www.linkfile.de/delfile.php?id=
52d5ff851a30e1458e1527abd79ddc76fa385fb5a8e79b41a0d37b12c9f95996

Da sind auch paar angepasste Grafiken mit dabei, auch auf Umlaute in Dateinamen solltest Du verzichten.

Cu Helmut