Rare CSS / html?

Status
Niet open voor verdere reacties.
H

Hajo2

Gebruiker
Lid geworden
14 okt 2010
Berichten
9
Hallo waarde mensen met meer kennis dan ik,

Ik ben voor het opzetten van een website voor een symposium bezig met html & css bestanden, alleen als ik de html-link gewoon vanaf m'n pc open werkt alles, maar nu het online staat veranderen de kleuren en werken sommige links niet. Ik zal het css bestand hieronder vermelden, ik weet niet of dit genoeg info biedt mbt het probleem. Kan het zijn dat er fouten in staan, of dat mijn html-bestanden niet worden ondersteund?

De website is sib-dies.nl

Alvast hartelijk dank, nogmaals ik heb geen idee of ik hiermee genoeg informeer, ik geef graag andere informatie mocht dit nodig zijn..

Hajo


/* standard elements */
html {min-height: 100%;}

* {
margin: 0;
padding: 0;
}

a {color: #963;}
a:hover {color: #C60;}

body {
background: #e6f2f8;
color: #444;
font: normal 62.5% Tahoma,sans-serif;
}

p,code,ul {padding-bottom: 1.2em;}

li {list-style: none;}

h1 {
font: normal 1.8em Tahoma,sans-serif;
margin-bottom: 4px;
}

code {
background: #FFF;
border: 1px solid #EEE;
border-left: 6px solid #C1CAD3;
color: #666;
display: block;
font: normal 1em Tahoma,sans-serif;
line-height: 1.6em;
margin-bottom: 12px;
padding: 8px 10px;
white-space: pre;
}

blockquote {
background: url(img/quote.gif) no-repeat;
display: block;
font-weight: bold;
padding-left: 28px;
}

h1,h2,h3 {padding-top: 6px;}

/* misc */
.clearer {clear: both;}

.left {float: left;}

.right {float: right;}

/* structure */
.container {
background: #FFF;
font-size: 1.2em;
margin: 0 auto;
padding: 0 10px 10px;
width: 780px;
}

/* header */
.top {
.left, .background .right: url(img/clouds.jpg) left;
padding: 50px 10px 0;
}

/* title */
.header {
background: #FFF;
font-size: 1.2em;
height: 150px;
margin: 0 auto;
padding: 10px 10px 5px;
width: 780px;
}
.header .left, .header .right {
background: #007cc2;
color: #FFF;
height: 150px;
}
.header .left {
background: #B3C2C7 url(img/header.jpg) no-repeat;
font: normal 2.8em "Trebuchet MS",sans-serif;
line-height: 150px;
text-align: center;
width: 564px;
}
.header .right {
overflow: auto;
width: 212px;
}
.header .right p,.header .right h2 {padding: 0 16px;}
.header .right h2 {padding-top: 16px; font: normal 1.6em "Trebuchet MS",sans-serif;}

/* navigation */
.navigation {
background: #D9E1E5 url(img/nav.jpg);
border: 1px solid #DFEEF7;
border-color: #DFEEF7 #CFDEE7;
height: 41px;
}
.navigation a {
background: #007cc2 url(img/nav.jpg);
border-right: 1px solid #AFBEC7;
color: #456;
display: block;
float: left;
font: bold 1.1em sans-serif;
line-height: 41px;
padding: 0 20px;
text-decoration: none;
}
.navigation a:hover {background-position: left bottom; color: #234;}

/* main */
.main {
border-top: 4px solid #FFF;
background: url(img/bgmain.jpg) repeat-y;
}

/* sub navigation */
.sidenav {
float: right;
width: 210px;
}
.sidenav h2 {
color: #5A5A43;
font-size: 1em;
line-height: 30px;
margin: 0;
padding-left: 12px;
}
.sidenav ul {
padding: 0;
border-top: 1px solid #EAEADA;
}
.sidenav li {border-bottom: 1px solid #EAEADA;}
.sidenav li a {
font-size: 1.1em;
color: #554;
display: block;
padding: 8px 0 8px 5%;
text-decoration: none;
width: 95%;
}
.sidenav li a:hover {
background: #F0F0EB;
color: #654;
}

/* content */
.content {
float: left;
margin: 10px 0;
padding: 0 16px;
width: 531px;
}
.content .descr {
color: #664;
font-size: 0.9em;
margin-bottom: 6px;
}
.content li {
list-style: url(img/li.gif);
margin-left: 18px;
}
.content p {font-family: "Lucida Sans Unicode",sans-serif;}

/* footer */
.footer {
background: url(img/bgfooter.jpg) repeat-x;
color: #FFF;
font: bold 1em sans-serif;
line-height: 39px;
text-align: center;
}
.footer a,.footer a:hover {color: #FFF;}
 
Ik zie niet precies wat er mis is? Kun je een screenshot posten van hoe het er uit moet zien?
 
Hier een screenshot van hoe het hoort en hoe het nu opent in Firefox :s En IE is niet beter.

Slecht.jpg

goed.jpg
 
Als ik mijn debugger in Chrome erop zet krijg ik de volgende meldingen:

/img/nav.jpg Failed to load resource: the server responded with a status of 404 (Not Found)
/img/bgmain.jpg Failed to load resource: the server responded with a status of 404 (Not Found)
/img/bgfooter.jpg Failed to load resource: the server responded with a status of 404 (Not Found)

Ik vermoed dat je een paar dingen bent vergeten te uploaden.
 
Volgens mij kwam het omdat ik een paar keer .JPG had in plaats van .jpg
Het lijkt nu opgelost te zijn, ik denk dat dit het was? :) In dat geval super bedankt :D
 
Hm, alleen een afbeelding op de homepage lijkt in IE niet te werken en firefox wel, maar dat kan komen omdat de afmetingen te groot zijn voor de grenzen van de website...
 
Goed, excuses voor de vele posts achter elkaar, maar vreemd genoeg werkt de afbeelding op de homepage in firefox wel, maar niet in IE. Andere afbeeldingen werken wel prima. Ik heb de afmetingen veranderd, maar dit had geen effect.

De regel in het html bestand is de volgende:
<p><a href="http://www.sib-groningen.nl" target="_blank"> <img src="dies.jpg"></a>
</p>

En ik heb dies.jpg in zowel dezelfde map als index.html gezet als de map met de andere afbeeldingen, maar ook dit had geen effect. Heeft iemand enig advies hiervoor?
 
Hoi Hajo2,
Het regeltje moet officieel zijn:
HTML: 
<p><a href="http://www.sib-groningen.nl" target="_blank"><img src="dies.png" alt="" /></a></p><br />
Het alt-attribuut erbij, en een slash op het eind van het <img> en de <br> erbij.
Het DOCtype helemaal aan het begin hoort te zijn:
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
... enz.
Zo zitten er nog een paar html-foutjes in.

Maar op 't moment doet bij mij de afbeelding het ook in IE7 prima. :)
Heb je intussen uitgevonden wat 't was, of gaat het om een andere IE-versie (dewelke?)?

Met vriendelijke groet,
CSShunter
 
Hartstikke bedankt voor de tips. Heb van de jpeg gewoon een png gemaakt,
misschien een vreemd truucje maar het werkte volgens mij wel :)

Ik zal het voorlopig als opgelost beschouwen, allemaal bedankt voor het advies!
 
Heb van de jpeg gewoon een png gemaakt, misschien een vreemd truucje maar het werkte volgens mij wel
Klik om te vergroten...
Ah, die! Ja, dat komt wel eens meer voor: er zijn op een of andere manier jpg-types die zó zijn opgeslagen dat Internet Explorer er niet mee overweg kan.
Hier op 't forum kwam er een paar maanden geleden ook zo'n geval voorbijvliegen, maar ik weet niet meer waar die zit. De oplossing was toen: openen met een tekenprogramma als IrfanView of Paint Shop Pro (daarin ook zichtbaar), en dan her-opslaan als jpg.
Maar ook op andere plekken wordt het gesignaleerd: bv. hier en hier ("in Photoshop een afbeelding opgeslagen als JPG. Toen pakten verschillende browsers hem niet.")

Met vriendelijke groet,
CSShunter
 
Ligt het niet gewoon eraan dat sommige programma´s het opslaan als .jpeg ipv .jpg? Er zijn zoveel mensen die in Windows het tonen van extensies uit hebben staan en die dus niet eens kunnen zien wat de echte extensie is.
 
Nee, dat is het niet.
Het zit 'm echt in de manier van opslaan (van sommige beeldbewerkingsprogramma's), en niet in de uitgang.

Ook als je een jpg opslaat als .jpeg kan Internet Explorer (IE6 en IE7 getest) gewoon de afbeelding laten zien. Zelfs ook als je 'm extensieloos opslaat!

frats-avatar-hernoemd-tot-extensieloos

frats-avatar-hernoemd-tot-extensieloos​
Achtereenvolgens op de testpagina: het origineel, hernoemd tot .jpeg, hernoemd tot extensieloos, heropgeslagen als .jpeg, geëxporteerd als standaard .jpg, geëxporteerd als progressieve .jpg.
Allemaal zijn ze ook in IE prachtig zichtbaar.

Met vriendelijke groet,
CSShunter
 
Hm, ok, vreemd :) Dan zal dat het geweest zijn. Bedankt in ieder geval!
 
Ja, maar waar het misgaat is als je verwijst naar image.jpg en het plaatje image.jpeg heet. In niet alle versies van windows is het verschil duidelijk te zien, ondanks dat ze in essentie hetzelfde zijn.
 
Hoi Frats,
Dat klopt ook weer. Maar dan is het bestand met of zonder de "e" er in verkeerd op de server gekomen, en is het met geen enkele browser te zien.
In dit geval was de jpg wel met de goede naam op de server gekomen, maar deed het wel in niet-IE, en niet in wel-IE. ;)

Met vriendelijke groet,
CSShunter
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan