Ergebnis 1 bis 7 von 7

Thema: Homepageproblem

  1. #1
    HTML Newbie
    Registriert seit
    01.01.2015
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Homepageproblem

    Hi,
    ich bin gerade dabei eine Seite für eine Homepage zu erstellen.
    HTML-Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
           "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>weltkehrt</title>
    <link rel="stylesheet" type="text/css" href="localhost/weltkehrt_1/main.css">
    </head>
    <body>
    
    <div id="menu"><ul>
        <li><a href="#">Bilder und Kunstwerke</a></li>
        <li><a href="#">Briefe und Texte</a></li>
        <li><a href="#">Tutorials und FAQ</a></li></ul>
    </div>
    <div id="v_navi">
        <h2>weltkehrt</h2>
        <div class="circle"><img href="#"></div>
        <ul><li><a href="#">Kontakt</a></li>
        <li><a href="#">Impressum</a></li></ul>
    </div>
    <div id="content">
        <h2>Herzlich Willkommen</h2>
    <p>Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.
    Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.
    Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.
    Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.
    Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.
    Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.
    Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.Lorem ipsum dolor sit edmet.
    </p></div>
    
    <div id="footer">2013 - 2014</div>
    
    </body>
    </html>
    und CSS

    Code:
    body {
        background_color: #FAFAFA;
    }
    
    #content {
        float: right;
        width: 80%;
        text-align: justify;
        height: 100%;
        background-color: yellow;
    }
    #v_navi {
        float: left;
        width: 20%;
        margin-right: 0 auto;
        text-align: right;
        height: 100%;
        background-color: red;
    }
    
    #menu {
        position: relative;
        width: 100%;
        margin: 20px auto;
        background-color: blue;
    }
    
    #menu ul {
        position: abolsute;
        margin: 0 auto;
        list-style: none;
        
    }
    
    #menu ul li {
        float: left;
        margin: 0 0 0 20px;
    }
    
    .#footer {
        clear:both;
        overflow:hidden;
        text-align: center;
        font-size:16px;
        line-height:1.3;
    } 
    
    .circle {border-radius: 50%;
    width: 200px;
    height: 200px;
    }
    Und hier ein Bild damit ihr euch vorstellen könnt wie es aussehen soll

    Danke für eure Hilfe
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Angehängte Grafiken Angehängte Grafiken

  2. #2
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Homepageproblem

    Was genau ist jetzt die Frage?

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    01.01.2015
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Homepageproblem

    Was die Lösung ist, damit mein Code so angezeigt wird wie in dem Bild.

  4. #4
    Bandit
    Gast

    Standard AW: Homepageproblem


  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    01.01.2015
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Homepageproblem

    Hab mir die Seite mal angeguckt. Mir ist das mit dem FLOAT schon logisch, aber ich weiß nicht was ich falsch gemacht habe, dass es einfach nicht funktioniert...

  6. #6
    Bandit
    Gast

    Standard AW: Homepageproblem

    Bitte mal einen Link zur Seite posten, damit man sich das mal ansehen kann.

    Was mir merkwürdig erscheint ist

    <link rel="stylesheet" type="text/css" href="localhost/weltkehrt_1/main.css">

  7. #7
    Großmeister(in)
    Registriert seit
    04.08.2009
    Beiträge
    585
    Danke
    0
    Bekam 69 mal "Danke" in 67 Postings

    Standard AW: Homepageproblem

    Hallo,

    ich denke auch das dir ohne Link zu der Seite (eventuelle bei einem Freeware-Provider wie bplaced.net) nicht zu helfen ist.

    Das fängt schon damit an, das deine Grafik offensichtlich nicht zu deinem Quelltext passt. So ist in deinem Quelltext links die schmale Spalte und rechts die breite. In der Grafik ist das genau anders rum. In dem Quelltext hat die obere Navi einen blauen Hintergrund, in der Grafik der footer.

    Außerdem hast du verschiedene Tippfehler / Rechtschreibfehler im Quelltext, z. B. background_color, abolsute.

    Das Grundproblem scheint zu sein, das du dich vor den HTML- / CSS-Grundlagen drücken willst. Du hast zum Beispiel ein float (#menu ul li), das nicht durch ein clear oder ein clearfix abgeschlossen ist. Sowas geht bei der Vererbung beim CSS gar nicht. Lösch einfach mal dieses float um die Auswirkungen zu testen.

    Außerdem sollte man heutzutage bei neuen Seiten HTML5 und CSS3 und deren Elementen und Möglichkeiten benutzen.

    Gruss

    MrMurphy
    Geändert von MrMurphy (03.01.2015 um 15:59 Uhr)

Ähnliche Themen

  1. Homepageproblem
    Von Eclipse im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 02.10.2008, 22:53

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •