Siden vises forskjellig i browsere...

[Nicklas]

Hei!

 

http://home.no.net/nicklasa/ekholtracing/

 

Denne siden vises bare riktig i Explorer! I Opera så er det bare blitt sånn mellomrom på bildene i menyen og i FireFox så vises ikke menyen engang og teksten ligger helt feil.

 

Håper noen kan hjelpe meg med dette! Dette skjer hver gang jeg skal prøve å lage en hjemmeside.

 

Takker for alle svar!

[Sono Juventino]

En meny skal ikke være en div, men en uordned liste. Taggen for dette er <ul>_</ul>

 

Eksempel:

 

<ul id="abc">
   <li class="def">xxx/li>
   <li class="def">xx</li>
   <li class="def">xx</li>
   <li class="def">xx</li>
</ul>

 

Sett dette i toppen av stilarket ditt:

 

* {
   padding: 0;
   margin: 0;
}

 

Det nullstiller padding/margin i alle browsere. Tror det skal hjelpe litt. Er uansett smart å ha der.

 

Så på stilarket ditt og det blir så mye lettere å lese vis du bruker "tab" før du skriver koden inne i en class/id.

Endret 22. juni 2005 av ett

[thobaa]

hmmm

ser ikke linkene dine i hele tatt jeg

bruker mozilla 1.78 browser

Endret 22. juni 2005 av LoSerboss

[Nicklas]

@Ett: Hvordan skal jeg få med bildelinkene ved å bruke det du skrev der?

 

Og: Det ble ikke noe bedre ved å skrive det andre greiene på stil arket

[Sono Juventino]

Har ikke peil på linkene, men den siste koden min var mest til hjelp på ørsmå forskjeller i padding, margin i forskjellige browsere. Den var ikke ment å gjøre underverker.

 

Edit: forresten så kom menyen frem nå.

Du bør legge til list-style-type: none; fordi det er prikker over bildene i menyen.

Endret 22. juni 2005 av ett

[Nicklas]

Nå fikk jeg det til sånn ca... men hvordan får jeg vekk de sorte prikkene i FireFox? Og hvordan gjør jeg bildet om til en link.. asså hva skal jeg skrive i CSS stilen?

 

Ahh.. lenge siden jeg har drivi med det her nå så husker jo ingen ting nesten

 

EDIT: Og så er jo teksten i FireFox helt på ville veier...

Endret 22. juni 2005 av Nicklas

[Sono Juventino]

Dette er linkene:

  <li class="start">LINK HER</li>
  <li class="folka">LINK HER</li>
  <li class="bilder">LINK HER</li>
  <li class="filmer">LINK HER</li>
  <li class="gjestebok">LINK HER</li>
  <li class="annet">LINK HER</li>

 

Legg til

list-style-type: none;

i ul#menuwrap.

Endret 22. juni 2005 av ett

[Nicklas]

Dette er linkene:

  <li class="start">LINK HER</li>
  <li class="folka">LINK HER</li>
  <li class="bilder">LINK HER</li>
  <li class="filmer">LINK HER</li>
  <li class="gjestebok">LINK HER</li>
  <li class="annet">LINK HER</li>

 

Legg til

list-style-type: none;

i ul#menuwrap.

Sånn ja... men linkene funker ikke da

 

Slik er det nå:

 

<ul id="menuwrap">
  <li class="start"><a href="start.html">Start</a></li>
  <li class="folka"><a href="folka.html"></a></li>
  <li class="bilder"><a href="bilder.html"></a></li>
  <li class="filmer"><a href="filmer.html"></a></li>
  <li class="gjestebok"><a href="gjestebok.html"></a></li>
  <li class="annet"><a href="annet.html"></a></li>
</ul>

 

Der hvor det står Start på første linja gjør slik at linken kommer fram. Men det er tekst og ikke bilde

Endret 22. juni 2005 av Nicklas

[Magnus Holm]

Du må gjøre sånn:

<a href="LINK"><li class="start">Link-tekst</li></a>
<a href="LINK"><li class="folka">Link-tekst</li></a>
<a href="LINK"><li class="bilder">Link-tekst</li></a>
<a href="LINK"><li class="filmer">Link-tekst</li></a>
<a href="LINK"><li class="gjestebok">Link-tekst</li></a>
<a href="LINK"><li class="annet">Link-tekst</li></a>

Tror jeg...

[Nicklas]

Du må gjøre sånn:

<a href="LINK"><li class="start">Link-tekst</li></a>
<a href="LINK"><li class="folka">Link-tekst</li></a>
<a href="LINK"><li class="bilder">Link-tekst</li></a>
<a href="LINK"><li class="filmer">Link-tekst</li></a>
<a href="LINK"><li class="gjestebok">Link-tekst</li></a>
<a href="LINK"><li class="annet">Link-tekst</li></a>

Tror jeg...

Der ja! Tusen takk!

 

Nå er det bare ett problem igjen; Hvordan får jeg teksten til å plassere seg riktig i FireFox?

 

EDIT: Når jeg skrev "Float: Right;" på "#Hoved" så ble det litt bedre hvertfall, men det er for langt til venstre. Og hvis jeg tar på mer padding så blir den jo annerledes i de andre browserne

Endret 22. juni 2005 av Nicklas

[Sono Juventino]

Du må gjøre sånn:

<a href="LINK"><li class="start">Link-tekst</li></a>
<a href="LINK"><li class="folka">Link-tekst</li></a>
<a href="LINK"><li class="bilder">Link-tekst</li></a>
<a href="LINK"><li class="filmer">Link-tekst</li></a>
<a href="LINK"><li class="gjestebok">Link-tekst</li></a>
<a href="LINK"><li class="annet">Link-tekst</li></a>

Tror jeg...

Måten min er vel mere riktig? Linken skal inni lista. (<li>)

 

*ser på løsning til siste spørsmål.*

 

Du kan skrive

marin: 0 auto;

i #hoved.

Endret 22. juni 2005 av ett

[DevN]

Validerer vel ikke med <a><li>.

 

Sett opp slik heller:

HTML

<li><a>...</a></li>

 

CSS

a { display: block; width: 100% }

 

EDIT: Forresten så tror jeg ikke jeg fikk med meg spørsmålet, så svarte sikkert på noe irrelevant.

Endret 22. juni 2005 av DevN

[Nicklas]

Nå har jeg fått siden til å vises helt perfekt akkuratt som jeg vil ha den i både Opera og I.E, men IKKE FireFox! Jeg kan ikke skjønne at dere sier at FF er så jævlig bra!

 

Noen som kan fortelle meg hva jeg har gjort galt? Dessuten hvis jeg endrer på det slik at den vises riktig i FF, så vises den sikkert ikke riktig i de 2 andre igjen

[Nicklas]

Ikke for å være frekk, men der ser dere. Dere som er så FireFox fan klarer ikke finne ut av dette engang. Koden min er ikke så komplisert... er jo bare basic kunnskaper jeg har brukt. Er godt mulig dere bare ikke gidder å hjelpe meg. Men vis at jeg har gjort noe alvorlig galt så skal jeg kanskje endre mitt syn på firefox.

 

Og så er det veldig rart at den funker i både Opera og I.E, men IKKE firefox...

 

Innse det! FIREFOX SUGER! No offence!

[DevN]

Firefox suger ikke, den er bare litt ekstra nøye på ting. Gjør man alt korrekt, så funker det i Opera og Firefox, men ikke IE.

 

Gidder ikke noe HTML/CSS/whatever akkurat nå ...

[Nicklas]

Firefox suger ikke, den er bare litt ekstra nøye på ting. Gjør man alt korrekt, så funker det i Opera og Firefox, men ikke IE.

 

Gidder ikke noe HTML/CSS/whatever akkurat nå ...

Oki Takk for et svar!

 

Men altså da er det ikke noe feil med koden min.. det er bare jeg som må sette den opp annerledes? Men på hvilken måte da? Jeg klarer å få det til å funke i FF, men da blir det bare tull i de andre igjen, så jeg skjønner ikke hvordan dere klarer å få det til å funke i alle sammen på en gang!

[DevN]

Ok, har sett litt på det, og så ut som du hadde masse unødvendig søppel der.

 

Fjern "height: 163px;" fra #hoved.

 

Vet ikke om dette løser problemet, men du angir jo en høyde hvor boksen egentlig stopper, derfor tror Firefox at #footer skal plasseres under der.

 

Videre tror jeg floatingen er unødvendig enkelte steder:

 

Fjern "float: right;" fra #hoved.

Fjern "float: left;" fra #footer.

[Gronz]

Innse det! FIREFOX SUGER! No offence!

Koden din er dårlig, ikke Firefox. Hvis koden din hadde vært god hadde den fungert i Firefox. Grunnen til at koden fungere i Opera er at den nettleseren så vidt jeg vet har litt mykere HTML-parsingregler enn Firefox.

[Nicklas]

Ok, har sett litt på det, og så ut som du hadde masse unødvendig søppel der.

 

Fjern "height: 163px;" fra #hoved.

 

Vet ikke om dette løser problemet, men du angir jo en høyde hvor boksen egentlig stopper, derfor tror Firefox at #footer skal plasseres under der.

 

Videre tror jeg floatingen er unødvendig enkelte steder:

 

Fjern "float: right;" fra #hoved.

Fjern "float: left;" fra #footer.

Der ja! Tusen takk! Trodde det var noe alvorlig galt jeg nå Men var visst bare noen små tabber... så trekker tilbake alt jeg har sagt om FF