|
|
 | Browserforskel på ca. 1-2 px.
Fra : Benjamin Friis Niels~ |
Dato : 26-08-08 12:23 |
|
Jeg er netop ved at lave en hjemmeside a la et visitkort -Den
skal bare være helt simpel.
Når hjemmesiden vises i Safari ser den ok på min computer, men
hvis jeg bruger FF er der en forskel på 1-2px mellem nogle af
elementerne. Især synes jeg det er mærkeligt at kanten på højre
side af menu-punkterne forsvinder i FF.(jeg har ikke IE)
I første omgang troede jeg det var skrifttypen?! Den ændrede jeg
til "Times New..." men det blev ikke udlignet helt.
Tag et kig på hjemmesiden og dens kildekode www.benjaminfriis.dk
(CSS vises kun på forsiden -på de andre sider(som ikke alle er
HELT færdig...) er den ekstern).
Håber der er hjælp at finde.
Mvh Benjamin
--
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
| |
 jopa (26-08-2008)
| Kommentar
Fra : jopa |
Dato : 26-08-08 12:26 |
|
"Benjamin Friis Nielsen" <bfriisn@gmail.com> skrev
> Når hjemmesiden vises i Safari ser den ok på min computer, men
> hvis jeg bruger FF er der en forskel på 1-2px mellem nogle af
> elementerne. Især synes jeg det er mærkeligt at kanten på højre
> side af menu-punkterne forsvinder i FF.(jeg har ikke IE)
Korrekt fejlfri kode sikrer størst chance for ens udseende i forskellige
Browsere.
Prøv at rette dine fejl så er det udelukket
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.benjaminfriis.dk%2F
--
Mvh. John
www.jp-web.dk
www.web-graphic.dk
| |
Benjamin Friis Niels~ (26-08-2008)
| Kommentar
Fra : Benjamin Friis Niels~ |
Dato : 26-08-08 16:24 |
|
> > Når hjemmesiden vises i Safari ser den ok på min computer, men
> > hvis jeg bruger FF er der en forskel på 1-2px mellem nogle af
> > elementerne. Især synes jeg det er mærkeligt at kanten på højre
> > side af menu-punkterne forsvinder i FF.(jeg har ikke IE)
>
>
> Korrekt fejlfri kode sikrer størst chance for ens udseende i forskellige
> Browsere.
Ja, det er sjusket fra min side. De er nu blevet valideret, men det har ikke
hjulpet. Hvordan ser det i øvrigt ud i IE?
B
--
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
| |
ScooterGrisen (26-08-2008)
| Kommentar
Fra : ScooterGrisen |
Dato : 26-08-08 11:58 |
|
Du kan bruge : http://browsershots.org for at se hvordan din
hjemmeside ser ud i diverse browsere.
Jeg har også kæmpet med at få min side til at se ens ud i diverse
browsere.
Det vigtigste er vist du bruger doctype ligesom du også gør men
istedet for at bruge TRANSITIONAL så brug STRICT.
Med strict kan man vist opnå det mest ens i browserne og når du ændre
fra transisional til strict så får du sikker nogen advarsler om ting
du skal ændre men det jo kun godt for at få det lavet ens osv.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Nu kan jeg se dine øæå fucker up men det ved du måske.... eksempel :
st�rrelse
Hvis det kan hjælpe dig må du gerne kigge og bruge alt det kode du vil
fra min hjemmeside : http://mentos.homepage.dk
Her er noget fra min css som bruges på UL og LI måske du kan bruge
det:
Men jeg vil tro det er noget med dine padding og margin siden det ikke
ser ens ud. Prøv og skriv padding:0px; og margin:0px; alle steder og
se forskellen.
#menuscootermodeller, #menuhoved{
padding:0px;
margin:0px;
}
#menuscootermodeller ul, #menuhoved ul{
border:1px solid #374CB3;
list-style-type:none;
padding:0px;
margin:0px;
margin-bottom:20px;
background:#fff;
color:#000;
}
#menuscootermodeller li, #menuhoved li{
margin:0px;
padding-left:5px;
padding-right:5px;
padding-top:2px;
padding-bottom:2px;
white-space:nowrap;
font-size:small;
}
#menuscootermodeller #menuscootermodelleroverskrift, #menuhoved
#menuhovedoverskrift{
padding:6px;
margin:0px;
text-align:center;
background:#374CB3;
color:#fff;
text-shadow:2px 2px 1px #000;
font-size:medium;
font-weight:bold;
}
#menuscootermodeller li a, #menuhoved li a{
/*border:0px solid #000;*/
background:transparent;
color:#000;
font-weight:normal;
text-decoration:none;
font-size:small;
}
#menuscootermodeller a, #menuhoved a{
text-decoration:none;
}
#menuscootermodeller a:hover, #menuhoved a:hover{
text-decoration:underline;
/*border-bottom:2px solid #000;*/
}
| |
Erik Ginnerskov (26-08-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 26-08-08 22:15 |
| | |
ScooterGrisen (27-08-2008)
| Kommentar
Fra : ScooterGrisen |
Dato : 27-08-08 07:47 |
|
> Det er helt uden betydning, om man sætter transitional eller strict DocType,
> når bare man sørger for at koden overholder den definerede standard.
>
> Hvad der derimod har betydning er, om siden sætter browserne i quirks-mode
> (bagudkompatibel visningsmodel), da den er højst forskellig i de enkelte
> browserfabrikater:
>
> http://hjemmesideskolen.dk/html/elmnt/dtd.asp#qs
Som homer ville have sagt... DOH !
Du siger det at lige meget om det er transitional eller strict også
skriver du et link hvor der står det modsatte.
Og nej det er ikke lige meget hvilken man vælger der er forskel i
visningen.
| |
 Birger Sørensen (27-08-2008)
| Kommentar
Fra : Birger Sørensen |
Dato : 27-08-08 15:18 |
|
ScooterGrisen har bragt dette til os:
>> Det er helt uden betydning, om man sætter transitional eller strict DocType,
>> når bare man sørger for at koden overholder den definerede standard.
>>
>> Hvad der derimod har betydning er, om siden sætter browserne i quirks-mode
>> (bagudkompatibel visningsmodel), da den er højst forskellig i de enkelte
>> browserfabrikater:
>>
>> http://hjemmesideskolen.dk/html/elmnt/dtd.asp#qs
>
> Som homer ville have sagt... DOH !
>
> Du siger det at lige meget om det er transitional eller strict også
> skriver du et link hvor der står det modsatte.
> Og nej det er ikke lige meget hvilken man vælger der er forskel i
> visningen.
Det er vist et spørgsmål om at læse hvad der faktisk står...
Der er *ikke* forskel på visningen i transitional og strict - så længe
man sørger for standardoverholdelse.
Det gør man ved at <!DOCTYPE ... skal indeholde dtd'en - altså det link
der følger efter - f.eks. ... " http://www.w3.org/TR/html4/strict.dtd">
Det er i dtd'en den standard der skal overholdes står.
(dtd = DocTypeDefinition)
Hvis du undlader dtd'en, sættes browseren i quirks mode. Bagud
compatibel, og individuel for forskellige browsere.
Man kan definere sin egen standard og linke den i dtd'en.
Prøv at åbne en og se, f.eks.
http://www.w3.org/TR/html4/strict.dtd
Men det er nok ikke fikst at prøve, hvis man ikke ved hvad man gør...
Uden dtd'en, er det op til hver enkelt browser at definere alle de ting
der normalt står i den - og det er næppe ens...
Man kan så nok forvente at visningen for transitional og strict er ens,
selv i quirks mode, i en given browser - men næppe for forskellige
browsere.
Birger
| |
Erik Ginnerskov (29-08-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 29-08-08 11:37 |
|
ScooterGrisen wrote:
> Du siger det at lige meget om det er transitional eller strict også
> skriver du et link hvor der står det modsatte.
Præcis hvor på den side mener du at der står, at det gør en forskel for
visningen, om man sætter en transitional eller en strict DTD?
Der står, at det gør en forskel om man sætter en ufuldstændig DocTyp (uden
url til DTD) eller en fuldstændig (med url til DTD). Men det er en helt
anden historie.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk
| |
ScooterGrisen (28-08-2008)
| Kommentar
Fra : ScooterGrisen |
Dato : 28-08-08 08:28 |
|
jeg har haft 2 sider med den samme kode borset fra den ene var strict
og den anden var transistional. når jeg så koden i opera var det 2
pixels mellemrum under et billed på den ene siden men ikke den anden.
hvis jeg så skrev display:block; ved billedet blev det ens.
| |
Birger Sørensen (28-08-2008)
| Kommentar
Fra : Birger Sørensen |
Dato : 28-08-08 23:57 |
|
ScooterGrisen tastede følgende:
> jeg har haft 2 sider med den samme kode borset fra den ene var strict
> og den anden var transistional. når jeg så koden i opera var det 2
> pixels mellemrum under et billed på den ene siden men ikke den anden.
> hvis jeg så skrev display:block; ved billedet blev det ens.
Personligt tror jeg ikke så meget på Opera - den har andre problemer.
Siderne validerede, både HTML og CSS?
Og umiddelbart, er display en css egenskab, og som sådan har det ikke
noget at gøre med om det er strict eller transitional HTML der
anvendes.
Det fortæller sådan set bare browseren at elementet skal behandles som
en blok og ikke som inline. Og det har heller ikke noget med strict
eller transistional at gøre.
Umiddelbart må der have været noget andet forkert.
Birger
| |
Erik Ginnerskov (29-08-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 29-08-08 11:01 |
|
ScooterGrisen wrote:
> jeg har haft 2 sider med den samme kode borset fra den ene var strict
> og den anden var transistional. når jeg så koden i opera var det 2
> pixels mellemrum under et billed på den ene siden men ikke den anden.
Den side må du da gerne komme med et link til, så du kan underbygge din
påstand mad facts.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk
| |
Erik Ginnerskov (26-08-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 26-08-08 22:24 |
|
Benjamin Friis Nielsen wrote:
> Når hjemmesiden vises i Safari ser den ok på min computer, men
> hvis jeg bruger FF er der en forskel på 1-2px mellem nogle af
> elementerne. Især synes jeg det er mærkeligt at kanten på højre
> side af menu-punkterne forsvinder i FF.
Jeg ser så minimale forskelle i FF og Saf., at jeg ikke ville brugt tid på
det. Dine brugere ser sandsynligvis alligevel kun siden i den ene af de to
browsere.
> (jeg har ikke IE)
Den viser til gengæld en noget større lodret afstand mellem de fem vandrette
linjer foroven. Der skal du nok lige arbejde med margin/padding på
hr-elementet.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk
| |
Benjamin Friis Niels~ (27-08-2008)
| Kommentar
Fra : Benjamin Friis Niels~ |
Dato : 27-08-08 11:53 |
|
Tak for jeres tips. Efter lidt nørklen fandt jeg ét af problemerne. Kanten der
sidder på højre side af menu-punkterne er lavet med designet "groove", som
egentlig er en ramme bestående af to forskellige farver. TILFÆLDIGVIS er den
ene farve den samme som min baggrund -dvs. at kanten er der, men man kan ikke
se den.
<hr> har fået margin
Hvad angår problemet med de 1-2px, har jeg besluttet at jeg vil leve med, at
det nok aldrig bliver helt perfekt.
B
--
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
| |
Erik Ginnerskov (29-08-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 29-08-08 12:04 |
|
Benjamin Friis Nielsen wrote:
> <hr> har fået margin
Du har til gengæld fået et nyt problem i IE. Siden indlæser slet ikke css,
muligvis på grund af den content-type, du har sat øverst på siden. Slet den
og indsæt i stedet denne mellem <head og </head>:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk
| |
Benjamin Friis Niels~ (31-08-2008)
| Kommentar
Fra : Benjamin Friis Niels~ |
Dato : 31-08-08 14:21 |
|
> > <hr> har fået margin
Har lige hentet IE 5.2 (jeg har mac og IE opdateres ikke hertil længere). <hr>
øverst på min side er sat til at have en margin på 8px, hvilket den åbenbart
ikke rigtig kan acceptere. Det skal sådan set bare forestille nogle
node-linier. Men skidt nu med det.
> Du har til gengæld fået et nyt problem i IE. Siden indlæser slet ikke css,
> muligvis på grund af den content-type, du har sat øverst på siden. Slet den
> og indsæt i stedet denne mellem <head og </head>:
>
> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
Hermed gjort. Problemet var dog, at en eller anden nisse havde været inde og
sætte et umotiveret semi-kolon i linket til css'et. Jeg har absolut INGEN
anelse om, hvor det kommer fra. Det var på to af siderne og er nu fjernet. Kan
nu også vises i den gamle version af IE for mac, men i mine øjne er der stadig
problemer med <hr>.
Om I er trætte af at beskæftige Jer med denne tråd, er jeg tilfreds med de
svar jeg har fået og nogenlunde tilfreds med udbyttet heraf(hjemmesidens
udseende).
Tak for denne gang, Benjamin
--
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
| |
Allan Vebel (31-08-2008)
| Kommentar
Fra : Allan Vebel |
Dato : 31-08-08 17:51 |
|
Benjamin Friis Nielsen skrev:
> men i mine øjne er der stadig problemer med <hr>
Du kan undlade at bruge <hr> til formålet, og i stedet
bruge et baggrundsbillede på din <h1> - det er meget
nemmere at styre, og så er du også fri for at bruge
position og negative margen.
Prøv at lege lidt med det!
--
Allan Vebel
http://html-faq.dk
http://vebel.dk
| |
Erik Ginnerskov (31-08-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 31-08-08 20:25 |
|
Benjamin Friis Nielsen wrote:
>>> <hr> har fået margin
> Har lige hentet IE 5.2 (jeg har mac og IE opdateres ikke hertil
> længere).
Den version kender jeg ikke, platformen i sig selv er ukendt land for mig.
<hr> øverst på min side er sat til at have en margin på
> 8px, hvilket den åbenbart ikke rigtig kan acceptere.
Det bliver næsten værre for hver rettelse. Prøv at lave det grafisk som
Allan forslår. En lille fil på 5px i bredden og 50 i højden lagt som
baggrund på h1.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk
| |
Johnny Winther Ronne~ (31-08-2008)
| Kommentar
Fra : Johnny Winther Ronne~ |
Dato : 31-08-08 18:27 |
|
Du har et lille hængeparti mere, du ikke er klar over  Sæt din
skærmopløsning til 800x600 og åben siden og minimer så vinduet. Ikke
forstået, så se her
http://ronnenberg.dk/news/benjamin.jpg
Jeg hare fornemmelse af, at det ikke var sådan menuen skulle se ud
Med venlig hilsen
Johnny Winther Ronnenberg
| |
|
|