kostenloser Webspace werbefrei: lima-city


Firefox und IE problem

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    lassidaassi

    lassidaassi hat kostenlosen Webspace.

    Hallo,

    Ich hab hier ein Problem beim Positionieren, weil der Mozilla Firefox das nicht so Anzeigt wie ich das will:

    <html>
    	<head>
    		<title></title>
                     <link rel="stylesheet" type="text/css" href="style.css">
    	</head>
    	<body>
             	<div align="center">
                     	<div class="header_top"></div>
                             <div class="header">
                             	<a href="#"><img src="img/logo.jpg" style="float:left; margin-left:70px;"></a>
                             	<div style="clear:both;"></div>
                                     <a href="#" class="header_link1">Impressum</a>
                                     <p align="center">~ Mit Sicherheit voll dabei ~</p>
                                     <div class="menu" align="left">
                                       	<div class="button"><a href="#">HOME</a></div>
                                             <div class="button"><a href="#">&Uuml;BER UNS</a></div>
                                             <div class="button"><a href="#">LEISTUNGEN</a></div>
                                             <div class="button"><a href="#">AKTUELLES</a></div>
                                             <div class="button"><a href="#">KONTANKT</a></div>
    
                                     </div>
                             </div>
                     </div>
    	</body>
    </html>

    Und Css:
    body {
     	background-color: #f5bb00;
    }
    img {
    	border:0px;
    }
    .header_top{
     	width: 922px;
             height: 48px;
             background-image: url(img/header1.jpg);
    }
    .header{
     	width: 922px;
             height: 78px;
             background-image: url(img/header2.jpg);
    }
    .header p {
     	color: #064187;
             font-family: verdana;
             font-size: 11px;
             font-weight: bold;
             margin-top:-79px;
    }
    
    .header_link1 {
      	color:#1a3c88;
             font family: verdana;
             font-size: 12px;
             text-decoration:none;
             float:right;
             margin-right: 90px;
             margin-top:-80px;
    }
    .header_link1:hover {
     	text-decoration: underline;
    }
    .menu {
          width:590px;
          height:30px;
          margin-right: -180px;
          margin-top:36px;
    }
    .button{
    	width: 95px;
             height:30px;
             border: solid #1a3c88 1px;
             text-align:center;
     	color: #1a3c88;
             font-family: verdana;
             font-size:12px;
             padding-top: 6px;
             float:left;
             margin-left:3px;
             font-weight:bold;
     }
    .menu a {
            color:#1a3c88;
             font family: verdana;
             font-size: 12px;
             text-decoration:none;
    
    }
    .menu a:hover{
     	text-decoration: underline;
    }


    Der Firefox zeigt die Buttons weiter unten an und nicht in dem Bereich "header".

    Bitte helft mir!

    Danke!
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. w******s

    Lad ma die Sachen hoch oder gib den Link von der Seite an, dann ist es wesentlich einfacher zu sehen wo der Fehler ist. Sonst muss man erst deinen Code studieren.

    Tipp: Du kannst es ja mal selbst probieren, indem du mit FF Addon Firebug da ran gehst. Das ist in solchen Sachen sehr nützlich.

    Gruß werktags
  4. Autor dieses Themas

    lassidaassi

    lassidaassi hat kostenlosen Webspace.

    jetzt hab ich´s hochgeladen lassidaassi.lima-city.de
  5. e********l

    Aua...
    1) Kein Doctype gesetzt -> Quirksmodus -> Ganz Böse!
    2) Man beginnt die Entwicklung im Idealfall aufm Firefox, weil der näher am W3C Standard ist. Danach kommt der IE dran. Im Idealfall parallel testen.
    3) Die Menuelemente würde ich mit Listen machen. Das ist wesentlich einfacher.
  6. Bei dir ist in jedem Browser ein anderer Fehler:


    IE (richtig) :thumb:

    T-Online-Browser (richtig) :thumb:

    Google Chrome :puke:

    Firefox :puke:

    Opera :puke:

    Safari :puke:


    Da würde ich mir mal ganz stark Gedanken machen!



    Beitrag zuletzt geändert: 6.4.2009 14:17:22 von cookies
  7. w******s

    Deine Seite hab ich mir mal vorgenommen und etwas angepasst. Ich erläuter hier jetzt nicht alles sondern nur ein paar grundlegende Sachen. Hier kannste dir das ganze anschauen und deine Quelltexte verbessern.

    Also grundlegend war schon ein recht unübersichtlicher Aufbau. Da würd ich mir demnächst vorher ein paar Gedanken machen. Das ist nämlich nicht unwichtig. Hab in Grunzügen etwas mehr Ordnung hineingebracht. Dein "div class="header" hab ich in ein "div class="bottom" benannt und relativ positioniert um dann die Elemente, die dadrin sind absolut positonieren zu können. Das hat den Vorteil, dass alles einen festen Platz hat. Mein Positionierungen weichen von deiner immer um ein paar Pixel ab. Da kannst ja noch mal probieren. Das mit dem Menü habe ich etwas besser gelöst, da du zu viele unlogische divs genutzt hast, ich dagegen "ul li". Den Link selbst habe ich den Wert "display: block" gegeben. Somit ist nicht nur das bisjen in der Box, sondern die ganze Box als Link klickbar.
    Getestet mit IE6 und FF3.
    Fragen dazu kannste hier gerne stellen oder ne PN an mich;-)

    Gruß werktags

    Edit: @kekse: Du hast zuviele Browser;-) daher bitte nochmal testen..

    Beitrag zuletzt geändert: 6.4.2009 14:33:59 von werktags
  8. Das geht jetzt in allen Browsern, die ich oben genannt habe.
  9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!