Sie sind nicht angemeldet.

  • [Hilfe: (x)HTML/CSS] Probleme mit IE

    1

    Montag, 1. Februar 2010, 21:13

    Probleme mit IE

    Ich hab da mal ein Problem mit mit IE. Also ich habe mir eine DVD von V2b gekauft mit dem Titel Jetzt lerne ich CSS. Darin wir eine kleine Demo Homepage aufgebaut. Ich habe alles genau gemacht wie es erklärt wird und habe jetzt doch ein Problem. In Firefox werden die Seiten alle so angezeigt wie sie im Stylesheet geschrieben wurden und es funzt alles. Sobald ich das Teil in IE öffne werden drei Seiten normal angezeigt und die vierte ist total verschoben also nicht mehr zentriert wie der Rest sondern der ganze wrapper nach links geschoben. Wie kann ich das beheben?

    2

    Montag, 1. Februar 2010, 21:21

    Zeig doch mal deinen Quelltext, dann kann man dir vermutl. besser helfen.
    Die Handys werden kleiner, die Models werden dünner, das Internet wird schneller,
    Verträge werden unkündbar, die Autos werden hybrid, 2 Stücke 'n Fünfer

    Morgen wachen wir auf inmitten rauchender Trümmer

    Die Menschen werden grösser, doch leider auch dümmer, Tsunamis kommen öfter, die Stürme werden schlimmer,ich mache mir Gedanken, nachts in meinem Zimmer

    Morgen wachen wir auf inmitten rauchender Trümmer

    Prinz Pi


    3

    Montag, 1. Februar 2010, 21:28

    Ein Auszug aus dem Stylesheet wäre wirklich recht hilfreich.
    Hast du body auf text-align:center ?
    currently: JavaScript (basics) & Prolog

    software project: Java MP3-Player

    next tutorials: JOIN Operations, CREATE Procedure

    skills: (x)HTML, CSS(3), PHP, SQL, Java, Haskell, Prolog

    4

    Montag, 1. Februar 2010, 21:37

    /* ===============================

    Stylesheet Der Brücke
    Stand Ordnung CSS
    Datei: bildschirm.css
    Datum: 01. Februar 2010
    Autor: Jürgen Schmidt

    Aufbau: 1. Kalibrierung
    2. Allgemeine Styles
    3. Styles für Layoutbereiche
    4. Sonstige
    ================================== */

    /* =================================

    1. Kalibrierung

    =============================== */
    * { padding: 0; margin: 0; }
    h2, p, ul, ol { margin-bottom: 1em; }
    li { margin-left: 2em; }

    /* =================================

    2. Allgemeine Styles

    =============================== */
    html {height: 101%; }

    body {
    background-color: #0f84c0;
    color: white;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: small;

    }
    h1 { font-size: 150%; }
    h2 { font-size: 130%; }
    address {
    text-align: center;
    font-size: 80%;
    font-style: normal;
    letter-spacing: 2px;
    line-height: 1.5;

    }
    a { text-decoration: none;
    outline: none;
    }
    a:link { color: #90000; }
    a:visited { color: #cc6600; }
    a:hover, a:focus { border-bottom: 1px solid #d90000; }
    a:active {
    background-color: #d90000;
    color: white;
    }
    .skiplink {

    position: absolute;
    top: -5000px;
    left: -5000px;
    width: 0;
    height: 0;
    overflow: hidden;
    display: inline;
    }
    #logo {
    background-color: white;
    color: black;
    padding: 5px;
    border: 5px solid #d9d9d9;
    }

    /* =================================

    3. Styles für Layoutbereich

    =============================== */
    #wrapper {
    background-color: white;
    color: black;
    width: 956px;
    margin: 10px auto;
    }
    #kopfbereich {
    position: relative;
    background-color: #a0a7e2;
    background-image: url( farbverlauf.jpg );
    color: black;
    padding-top: 5px;
    padding-right: 20px;
    padding-bottom: 0;
    padding-left: 20px;
    }

    #kopfbereich p {
    position: absolute;
    top: 10px;
    right: 20px;
    padding: 5px 0;
    margin-bottom: 20px;
    }

    #navibereich {
    text-align: right;
    background: #a0a7e2 url( farbverlauf.jpg ) top left;
    padding: 5px 10px 4px 10px;
    border-bottom: 1px solid #8c8c8c;
    }
    #navibereich ul {
    margin-bottom: 0;
    }

    #navibereich li {
    display: inline;
    list-style-type: none;
    margin-right: 20px;
    margin-left: 0;
    }
    #navibereich a,
    #navibereich span {
    background-color: #ffeda0;
    color: black;
    padding: 2px 8px 4px 8px;
    border: 1px solid #8c8c8c;
    }
    #bild {
    padding: 10px 20px 40px 20px;

    }


    #textbereich {
    padding: 20px 10px 20px 20px;
    }
    #textbereich a {
    border-bottom: 1px dotted #cc0000;
    }
    #textbereich ul il { list-style-type: square; }
    #textbereich a:hover
    #textbereich a:focus { border-bottom: 1px solid #d90000; !important;
    }
    #navibereich a:hover,
    #navibereich a:focus {
    background-color: white;
    color: black;
    border-bottom-color: white;
    }
    #startseite #navi01 span,
    #überuns #navi02 span,
    #beratungsstellen #navi03 span,
    #betreuteswohnen #navi04 span,
    #Kontakt #navi05 span,
    #Impressum #navi06 span, {
    background-color: white;
    color: black;
    border-bottom-color: white;
    }
    #fulda {
    padding: 10px 10px 20px 10px;
    }
    #hilders {
    padding: 10px 20px 20px 10px;
    }

    #fussbereich {
    padding: 10px 10px 20px 20px;
    border-top: 1px solid #353535;
    margin-top: 20px;
    }



    /* =================================

    4. Sonstiges

    =============================== */
    form {
    background-color: #eeeeee;
    color: black;
    width: 370px;
    padding: 20px;
    border: 1px solid #8c8c8c;

    }
    label {
    display: block;
    cursor: pointer;
    }

    input#absender, textarea {
    width: 300px;
    border: 1px solid #8c8c8c;
    margin-bottom: 1em;
    }
    textarea { height: 7em; }
    input#absender:focus,
    textarea:focus {
    background-color: #d9d9d9;
    color: black;
    }

    /* =================================

    Ende des Stylesheet
    =============================== */


    So da ist das Stylesheet.

    5

    Dienstag, 2. Februar 2010, 00:31

    Ok klare Sache. Der IE wird dir die Seite nicht zentriert anzeigen. Du musst deshalb für den IE sagen:

    Quellcode

    1
    2
    3
    
    body {
    text-align:center;
    }


    Und damit dann nicht im wrapper der gesamte Text auch zentriert angezeigt wird, sagst du dann im wrapper wieder:

    Quellcode

    1
    2
    3
    4
    
    #wrapper {
    text-align:left;
    margin: 10px auto;
    }


    So müsste er dir die Seite auch im IE zentiert anzeigen.
    currently: JavaScript (basics) & Prolog

    software project: Java MP3-Player

    next tutorials: JOIN Operations, CREATE Procedure

    skills: (x)HTML, CSS(3), PHP, SQL, Java, Haskell, Prolog

    6

    Dienstag, 2. Februar 2010, 16:41

    Jupp Fehler behoben. Ich danke dir. Eigentlich sollten die es von Video2brain wissen und gleich richtig zeigen.

    7

    Dienstag, 2. Februar 2010, 18:30

    Ja also eigentlich müssten die das wirklich zeigen. Aber du wirst denk ich in Sachen IE noch öfters auf Probleme stoßen. :zahn_weg:

    Du hast ja einen Global Reset benutzt, aber ich denke du solltest über einen größeren CSS Reset nachdenken. Am besten finde ich persöhnlich:

    Quellcode

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, font, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td {
    	margin: 0;
    	padding: 0;
    	border: 0;
    	outline: 0;
    	font-weight: inherit;
    	font-style: inherit;
    	font-size: 100%;
    	font-family: inherit;
    	vertical-align: baseline;
    }
    currently: JavaScript (basics) & Prolog

    software project: Java MP3-Player

    next tutorials: JOIN Operations, CREATE Procedure

    skills: (x)HTML, CSS(3), PHP, SQL, Java, Haskell, Prolog

    8

    Dienstag, 2. Februar 2010, 21:23

    Klasse und ich dachte man kann mit Video2brain und Galileo Computing wirklich was lernen. Man gibt einen Haufen Geld aus und dann haben die auch noch Fehler drin. Na ja ist ja kein Design zum vorzeigen sondern einfach eins zum lernen . Aber wenn ich das jetzt schon sehe dann bezweifle ich das ich jemals css richtig lernen werde. Da wünsche ich mir das veraltete Tabellendesign zurück. Hat immer alles gefunzt und gab nie solche Probleme.

    9

    Dienstag, 2. Februar 2010, 22:02

    Naja ich finde man lernt mit kostenlosen Tutorials von irgendwelchen Seiten genauso gut und man brauch sowieso immer ein wenig Zeit bis man es wirklich einigermaßen beherrscht. Ich könnte dir gerne hier noch ein Tutorial uploaden, falls ich es noch besitze, wie ich ein nettes Template code.
    currently: JavaScript (basics) & Prolog

    software project: Java MP3-Player

    next tutorials: JOIN Operations, CREATE Procedure

    skills: (x)HTML, CSS(3), PHP, SQL, Java, Haskell, Prolog

    10

    Mittwoch, 3. Februar 2010, 22:29

    hi hi...

    Naja man sollte schon erwarten können, dass es fehlerfrei ist.
    Aber weshalb sollten dann alle Games Patches benötigen?!
    ^^

    Also niemand ist perfekt und von daher passieren Fehler eben mal.
    *CSS lernen macht mehr Spaß als alles mit Tabellen zu machen :P:P


    Gibt ja wie mein Vorgänger bereits erwähnt hat, genug kostenlose Tutorials im Netz.
    *Ansonsten gibt es ja eben noch Grufix :P:P


    Mfg Fredooo
    (x)HTML: 98%

    PHP: 45%

    CSS: 60%

    AutoIt: 85%


    Projekte

    Shoutbox-Server: 20%

    Ticketsystem: 15%


    11

    Mittwoch, 3. Februar 2010, 23:09

    Naja ich finde man lernt mit kostenlosen Tutorials von irgendwelchen Seiten genauso gut und man brauch sowieso immer ein wenig Zeit bis man es wirklich einigermaßen beherrscht. Ich könnte dir gerne hier noch ein Tutorial uploaden, falls ich es noch besitze, wie ich ein nettes Template code.



    Das wäre Klasse denn ich verzweifle schon langsam.

    12

    Mittwoch, 3. Februar 2010, 23:30

    So tut mir jetzt echt leid. Das Tutorial hatte ich vor 2 Tagen gelöscht, weil ich es eh nie veröffentlichen wollte und nun hätte es sogar einen Einsatz gefunden. Aber ich mach dir gerne noch ein neues Tutorial. Zum Glück habe ich ja noch ein paar Tage Ferien.

    Würde ein Tutorial zu diesem Design hier reichen?
    currently: JavaScript (basics) & Prolog

    software project: Java MP3-Player

    next tutorials: JOIN Operations, CREATE Procedure

    skills: (x)HTML, CSS(3), PHP, SQL, Java, Haskell, Prolog

    13

    Donnerstag, 4. Februar 2010, 10:49

    Klar das würde schon mal reichen für den Anfang 8o

    14

    Freitag, 5. Februar 2010, 15:36

    Alles klar. Dann werde ich dich mal gleich ein wenig glücklicher machen.
    currently: JavaScript (basics) & Prolog

    software project: Java MP3-Player

    next tutorials: JOIN Operations, CREATE Procedure

    skills: (x)HTML, CSS(3), PHP, SQL, Java, Haskell, Prolog

    15

    Freitag, 5. Februar 2010, 18:28

    Hast du , hast du ich habs natürlich gleich runtergeladen und reingeschaut.

  • Grufix-Board.de - GFX Webdesign Foto & Coding Community

    Grafik-Tutorials | Coding-Tutorials | Ressourcen | SEO | Webdesign | HTML5
    W3C Validator