Avatar billede lasseq Nybegynder
02. juli 2004 - 13:01 Der er 22 kommentarer og
2 løsninger

Fejl med brug af "float" i Netscape

Hej
Jeg har lavet et stylesheet, hvor menuen og indholds-div'en benytter "float" for at kunne være på samme linje.

Så vidt så godt.
Det fungerer perfekt i Internet Explorer men i Netscape (7.0) ser det ud som om, indholdsdiv'en har fået en absolut positionering, og  ignorerer "float"-egenskaben.

www.temp.quorning.com

Nogen der kan hjælpe?
Avatar billede skovenborg Nybegynder
02. juli 2004 - 13:25 #1
måske du skulle ændre den samlede bredde lidt - den har du defineret som alt for lav i forhold til hvad IE gør:
html>body div#container{
      width:700px; /* Eller bare slet den */
    height: auto;
    min-height:100%;
}

og så sæt en width på din #main-div:
div#menu {
    padding-right:15px;
    font-size:12px;
    float:left;
}
div#main{
    position:relative;
    line-height:140%;
    padding-bottom:40px;
    float:left;
    width:500px;
}
Avatar billede skovenborg Nybegynder
02. juli 2004 - 13:28 #2
og så for at fikse højden:
html>body div#container{
      overflow:hidden;
    height: auto;
    min-height:100%;
}
kan dog ikke helt regne ud hvorfor overflow:hidden er nødvendig her, men sådan tolker Mozilla det åbenbart (og Opera brokker sig heller ikke over det)
Avatar billede Slettet bruger
02. juli 2004 - 13:29 #3
Det ser ud til at du har en tom linie før din DOCTYPE. Prøv at fjerne den. Så skulle det nemlig kunne lade sig gøre at få IE til at bruge standarsmode, og det gør det uendeligt meget lettere at få udseendet ens i forskellige browsere, hvis de i det mindste forsøger at vise det korrekt.
Avatar billede lasseq Nybegynder
02. juli 2004 - 13:45 #4
Okay, nu bliver det mærkeligt, det her.
Jeg har gjort som skovenborg har sagt. Ændret "html>body div#container", "div#menu" & "div#main". I Netscape har "main" godt nok flyttet sig op på plads. Men dens overflow begrænses af sidens højde? Altså, det overskydende indhold kan ikke vises?

I IE er der kommet en underlig fejl, nederst, efter Copyright, står der "l>". Det kan jeg ikke se nogen mening i :D
Avatar billede Slettet bruger
02. juli 2004 - 13:48 #5
Det kunne også være en ide at validere koden. Der er nogle fejl (men muligvis ikke nogen, der påvirker udseendet i de gængse browsere). De vigtigste fejl er:

HTML-kommentarer er nogle steder skrevet forkert. De egentlige regler for at lave en kommentar korrekt er ganske bøvlede (og mange parsere misforstår dem), men denne nedkogte udgave virker fint:
<!-- kommentar -->

Dvs. <! to minusser efterfulgt af kommentaren, som ikke må indeholde to minusser lige efter hinanden og afsluttet med to minusser og en >

Du har nogle links med et &-tegn. Det bør erstattes af &amp;

Forklaringen er, at & er et specielt tegn i HTML. Det bruges til en masse forskellige koder som f.eks. &nbsp; og &aelig; Når man bare skriver et & er browseren nødt til at gætte om det efterfølgende ord er en af disse koder, hvor man har glemt ; eller om det skal være et rent &. Det er sikrest at skrive linket, så browseren ikke kan misforstå noget.
Avatar billede Slettet bruger
02. juli 2004 - 13:52 #6
De !!! ---> i slutningen stammer netop fra en ukorrekt kommentar i din kode.
Avatar billede skovenborg Nybegynder
02. juli 2004 - 13:55 #7
ja, mindsandten om der ikke er forskel på Firefox 0.9 og Netscape 7 - også selvom de kører på den samme engine (selvom firefox's er noget nyere). Grunden til jeg skrev overflow:hidden (som du bare kan fjerne så), var at højden tilpassede sig på underlig vis højden af #main-diven i firefox, men i Netscape bliver den skjult, som man nok også kunne forvente
Avatar billede skovenborg Nybegynder
02. juli 2004 - 13:59 #8
det sidste l> er nu også fordi du havde skrevet:
<!-- InstanceEnd --></html>l>
til sidst ;-)
Avatar billede skovenborg Nybegynder
02. juli 2004 - 14:01 #9
det ser forresten også ud til at det virker bedre med:
html>body div#container{
      overflow:auto;
    height: auto;
    min-height:100%;
}
som virkede bedre i Netscape 7.1
Avatar billede skovenborg Nybegynder
02. juli 2004 - 14:03 #10
og så til sidst kunne du lige ændre dine kommentarer til:
<!-- InstanceBeginEditable name="Indhold" -->
        <h1>Velkommen til M&oslash;ldrup Web!</h1>
                <div style="float:right">
        <!-- import kode start -->
        <!-- IE Kode -->
        <NOLAYER>

        <iframe SRC="http://politiken.dk/VisArtikel.iasp?TemplateID=1563&Params=3;3;3;0;3;0;150;664;_blank;_1563;" WIDTH=150 HEIGHT=664 MARGINWIDTH=0 MARGINHEIGHT=0 HSPACE=0 VSPACE=0 FRAMEBORDER=0 SCROLLING=NO BORDERCOLOR="#000000"></iframe>
        <br>
        </NOLAYER>
        <!-- IE Kode -->
        <!--  Netscape kode -->
        <TABLE CELLSPACING=0 CELLPADDING=0 BORDER=0 HEIGHT=1 WIDTH=1>
          <TR>
            <TD><ILAYER ID=polnews VISIBILITY=hidden HEIGHT=664 WIDTH=150></ILAYER></TD>
          </TR>
        </TABLE>
        <!-- - Netscape kode-- -->
        <!-- import kode slut -->
        <!-- import kode start --- Skal placeres lige før </BODY>!!! -->
        <LAYER SRC="http://politiken.dk/VisArtikel.iasp?TemplateID=1563&Params=3;3;3;3;3;0;150;664;_blank;_1563;" visibility=hidden onLoad="moveToAbsolute(polnews.pageX, polnews.pageY); polnews.clip.height=664; polnews.clip.width=150; visibility='show';"></LAYER>
        <!-- import kode slut -->

        </div>
        <p>Her finder du alt hvad du skal bruge, uanset om du leder efter information fra lokalomr&aring;det, eller gode links til nyheder og meget andet.</p>
        <p>God forn&oslash;jelse med siden</p>
        <p>Venlig hilsen <br>
          <a href="mailto:webmaster@moeldrup-web.dk">Webmaster</a></p>

        --
                  <applet code="NewsTicker.class" codebase="http://politiken.dk/newsticker" name="PoliTicker" width="420" height="27">
            Hvis din browser kunne vise JAVA, ville du nu se Politikens aktuelle oversk<!-- InstanceEndEditable -->

Så burde de være rettet.
Avatar billede Slettet bruger
02. juli 2004 - 14:05 #11
To kommentar-rettelser mere:

<!-- - Netscape kode-- -->
til
<!-- Netscape kode -->

og

<!-- import kode start --- Skal placeres lige før </BODY>!!! -->
til
<!-- import kode start.  Skal placeres lige før </BODY>!!! -->
Avatar billede lasseq Nybegynder
02. juli 2004 - 14:20 #12
Hej igen
Tak for jeres svar. Jeg kender godt selv reglerne for kommentarerne, problemet var Politikens nyhedsavis, som jeg har sat ind. Nu har jeg rettet i kommentarerne, måske skulle jeg rette henvendelse til Politiken, så de retter deres hovedkode... "&" som bogstav erstattes automatisk af "&amp;" I Dreamweaver, og jeg har ikke kunnet finde nogle &'er på siden, som ikke var ændret i forvejen?

Det har vist sig at "overflow:auto" var nøgleordet for mit problem... Under alle omstændigheder vises siden korrekt i både NS og IE... Mange tak for det :D

En detalje er bare, at i NS, når man går fra hovedsiden (default.asp) til en anden, ændres bredden... Har prøvet med overflow-y:auto;overflow-x:hidden; men så kommer jeg tilbage til den noget ála overflow:hidden????

Uanset, så post mig begge et svar for jeres indsats :D
Avatar billede Slettet bruger
02. juli 2004 - 14:31 #13
Det uencodede & er også i Politikens kode. Det er i adresserne til iframe og layer.

Men nu ser siden da fornuftig ud i Firefox. (Jeg så aldrig det l> efter </html> men jeg så i stedet noget fra <!-- import kode start --- Skal placeres lige før </BODY>!!! -->-kommentaren.
Avatar billede Slettet bruger
02. juli 2004 - 14:32 #14
Og det var egentlig meningen, at det skulle have været et svar.
Avatar billede skovenborg Nybegynder
02. juli 2004 - 20:24 #15
l> kunne vist også kun ses i IE.

Egentlig en ret dum regel at man ikke må have to bindestreger inde i en kommentar - det giver lidt problemmer når man bruger kommenterer sin javascript (så den bliver skjult for ældre browsere). Nu tænker jeg på hvis man fx skriver variabel-- i sin javascript og det vil jo give en del problemmer så :-S
Avatar billede Slettet bruger
02. juli 2004 - 21:04 #16
Det er vel bare at se på den lyse side. Det er i det mindste ikke et enkelt minus, som ikke er tilladt. Og det er trods alt ikke svært at omskrive javascript, så der ikke bruges -- (variabel = variabel -1;). Eller man kan  lave som en ekstern script-fil.
Avatar billede lasseq Nybegynder
02. juli 2004 - 22:24 #17
OK... -- Er en lidt træls ting, generelt er der meget bøvl (som er nødvendigt) mht. til at lave en hjemmeside, der 100% understøtter de gængse browsere...

Tak for jeres deltagelse, men I har ingen bud på at undga at bredden forøges (jf forrige post?)
Avatar billede skovenborg Nybegynder
02. juli 2004 - 22:30 #18
næh, jeg kan ikke lige reproducere fejlen i netscape 7.1 som jeg har adgang til.

Bliver bredden da mindre eller større?
Avatar billede Slettet bruger
03. juli 2004 - 01:06 #19
Den ændrer heller ikke bredde i min Firefox 0.8. Det eneste, der ændrer sig er højden, som er større på forsiden for at Politikens nyhedsoversigt kan være der. På de andre sider er højden den samme.

Kan det være fordi tingene forskubber sig, når der er en scrollbar på forsiden, men ikke på de andre, hvis siden er for lang til vinduet?
Avatar billede lasseq Nybegynder
03. juli 2004 - 13:29 #20
Det kan godt være.... fejlen kommer, når man går fra siden http://temp.quorning.com/undersider/om.asp til f.eks. "Gode links" på menuen....
Kan I ikke se fejlen dér?
Avatar billede Slettet bruger
03. juli 2004 - 21:20 #21
Ikke så meget som en pixels forskel mellem de to sider - hverken i højde eller bredde - i Firefox 0.8 og Mozilla 1.6.
Avatar billede skovenborg Nybegynder
03. juli 2004 - 21:56 #22
heller ikke her i Firefox 0.9, Mozilla 1.5 eller Netscape 7.1
Avatar billede lasseq Nybegynder
04. juli 2004 - 15:07 #23
Mærkeligt... Men så må det vel være i den skønneste orden (bortset fra min pc ... :D )

Tak for denne gang.
Avatar billede skovenborg Nybegynder
04. juli 2004 - 15:11 #24
ja, ellers så er der virkelig problemmer med NS 7.0 som så er blevet rettet... men det må man så leve med indtil videre.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester