Dennis Munding wrote in dk.edb.internet.webdesign.html:
> Hej Leon
> "Leon Nielsen" skrev...
> > Hej alle
> >
> > Jeg har en privat hjemmeside:
www.mullepus.dk, som virker helt
> > fint i IE (mener det er IE 7 et eller andet).
> >
> > Til min skræk opdager jeg, at billedlinket under "Rejser"
> > (Californien 1994) ikke virker i Firefox og Safari.
> >
> > Koden til billedlinket burde være korrekt.
> >
> > De andre links, dem der er placeret i fanerne, virker fint.
> >
> > Jeg har surfet nettet tyndt for at finde en forklaring på dette,
> > for mig, mærkelige problem, men er ikke blevet klogere -
> > desværre.
> >
> > Skriver man hele adressen i i browersen, altså:
> >
www.mullepus.dk/californien.php, så virker billedserien i øvrigt
> > fint, og det er også links.
> >
> > I øvrigt virker title="lidt tekst" i linkkoden kun på
> > grafikfilen, men ikke på billederne....
> >
> > Er der en venlig sjæl, der har en løsning og også meget gerne en
> > forklaring.
>
> Løsningen...
>
> Din html for hhv. leftcol og rightcol kan skrives således:
>
> <KODE>
> <div id="colleft">
> <!--start californien 1994//-->
> <a href="
http://www.mullepus.dk/californien.php">
> <img src="usa/cablecar.jpg" title="Billedserie om min tur til den
> amerikanske vestkyst" width="100%"></a>
> <h2 class="gotimg">CALIFORNIEN 1994</h2>
> <!--slut californien 1994//-->
>
> <!--start london 2008//-->
> <img src="oddimages/more-to-come.gif" style="margin-top:.8em;" title="Kommer
> snart!" width="100%">
> <h2 class="noimg">LONDON 2008</h2>
> <!--slut london 2008//-->
>
> <!--start paris 2010//-->
> <img src="oddimages/more-to-come.gif" style="margin-top:.8em;" title="Kommer
> snart!" width="100%">
> <h2 class="noimg">PARIS 2010</h2>
> <!--slut paris 2010//-->
> </div>
>
>
> <div id="colright">
> <!--start new york 1996//-->
> <img src="usa/new%20york%20night.jpg" title="Kommer snart!" width="100%">
> <h2 class="gotimg">NEW YORK 1996</h2>
> <!--slut newyork 1996//-->
>
> <!--start rom 2009//-->
> <img src="oddimages/more-to-come.gif" style="margin-top:.8em;" title="Kommer
> snart!" width="100%">
> <h2 class="noimg">ROM 2009</h2>
> <!--slut rom 2009//-->
>
> <!--start stockholm 2010//-->
> <img src="oddimages/more-to-come.gif" style="margin-top:.8em;" title="Kommer
> snart!" width="100%">
> <h2 class="noimg">STOCKHOLM 2010</h2>
> <!--slut stockholm 2010//-->
> </div>
> </KODE>
>
> Den matchende css (filen "column.css") kommer så til at se således ud:
>
> <KODE>
> #colleft {
> width:49%;
> float:left;
> text-align:justify;
> }
> #colright {
> width:49%;
> float:left;
> margin-left:2%;
> text-align:justify;
> }
> ..clb {clear:both;}
>
> #colleft h2.gotimg, #colleft h2.noimg, #colright h2.gotimg, #colright
> h2.noimg { ----> [1]
> margin-top:-32px;
> text-align:center;
> font-family:'Times New Roman', serif;
> }
> h2.gotimg {
> color:#fff;
> }
> h2.noimg {
> color:#000;
> }
> </KODE>
>
> [1] : Sikrer at det kun er h2-tags i de pågældende kolonner på den
> pågældende side, som bliver berørt.
> Bemærk ændringen fra class til id på colleft og colright. Dette
> sikrer at andre h2-definationer ikke bliver taget i brug.
>
> Personligt ville jeg have valgt id til begge kolonner fra starten, da de
> begge er unikke på siden.
> Du bør desuden - for din egen skyld - fjerne din inline styling af din
> billeder.
> Og sidst men ikke mindst, bør du undgå at "presse" billederne sammen ved
> hjælp af styling, som er tilfældet med dine "width:100%;" på <img>.
> Skær dem til i et passende program istedet. Det nedsætter også
> indlæsningshastigheden.
>
>
> Forklaringen...
>
> Som Kim Ludvigsen påpeger, så ligger nogle af dine elementer ovenpå
> hinanden - det sker let, når man positionerer absolut.
> (Jeg taler af egen dårlig erfaring.)
> Undgå så vidt muligt absolut positionering, da det river elementerne ud af
> sidens naturlige flow...
>
> NB!!!
> Ovenstående kode er _kun_ testet i FF5.0!!
>
>
> Med venlig hilsen
> --
> Dennis Munding
> a.k.a. The Eye - Member of the PosseGrim Squad
>
http://pgsquad.com/
> "When you hear the wind - you're already dead..."
>
Tusinde tak alle.
Mht. absolute og relativ positionering, så har jeg prøvet uden, Firefox vil
stadig ikke tage billedet som link.
Dennis, tak for det udførlig svar og test af koden.
Ja, der er nok at gå i gang med
Mvh. Leon
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! =>
http://www.html.dk/tutorials