Chrome Background Issue

[Verwijderd]

Ik heb een probleem met Google Chrome. Zoals je kunt zien heb ik linksonder en rechtsonder een wit blokje, enkel in Chrome ook alleen:



CSS:

code:

body
{
    background:url(images/bg.png) #000 repeat-y center;
}

is toch niets verkeerd aan?

[RobIII]

Wel verkeerd. Het is <kleur> <afbeelding> <attachment> <positie>

[ Voor 22% gewijzigd door RobIII op 08-10-2009 11:08 ]

[Verwijderd]

Woah. Geld dat ook voor alles dat het in een bepaalde positie moet? Bijvoorbeeld eerst margin, dan padding, dan float enzovoort? Of maakt dat niet uit? Anders heb ik nog een lange weg te gaan

[Icelus]

Verwijderd schreef op donderdag 08 oktober 2009 @ 11:10:
Woah. Geld dat ook voor alles dat het in een bepaalde positie moet? Bijvoorbeeld eerst margin, dan padding, dan float enzovoort? Of maakt dat niet uit? Anders heb ik nog een lange weg te gaan

De opbouw geldt per commando (background, padding etc.). De volgorde van de commando's maakt niet uit (float mag bijv. na of voor margin).

[Yoozer]

Verwijderd schreef op donderdag 08 oktober 2009 @ 11:10:
Anders heb ik nog een lange weg te gaan

Nee, gewoon

Cascading Stylesheet:

body{
background-position:center;
background-image:url(images/bg.png);
background-repeat:repeat-y;
background-color:#000000;
}

Nooit meer nadenken over volgorde en CSS wordt toch wel door de browser gecached - anders maken die paar regels ook niks meer uit.

edit: sneller op reply gedrukt

[ Voor 27% gewijzigd door Yoozer op 08-10-2009 11:17 ]

[moozzuzz]

Verwijderd schreef op donderdag 08 oktober 2009 @ 11:10:
Woah. Geld dat ook voor alles dat het in een bepaalde positie moet? Bijvoorbeeld eerst margin, dan padding, dan float enzovoort? Of maakt dat niet uit? Anders heb ik nog een lange weg te gaan

Neen... Maar je code

Cascading Stylesheet:

body 
{
    background:url(images/bg.png) #000 repeat-y center;
}

is een zogenaamde shorthand-code en die vraagt dat net ietsje meer aandacht .

Cascading Stylesheet:

body {
/* net hetzelfde maar veel langer uitgeschreven: */
    background-image:url(images/bg.png);
    background-color: #000;
etc...
}

[.oisyn]

Het is ook logisch dat die volgorde uitmaakt. Je komt in de knoei zodra meerdere properties dezelfde waarde kunnen aannemen, zoals bijvoorbeeld bij de margin shorthand. Als de volgorde niet uit had gemaakt, hoe moet hij dan een 'margin: 0px 1px 2px 3px' interpreteren?

[JordyOnrust]

Margin: up, right, bottom, left.

Maar ik heb met Chrome ook al meerder background problemen gehad.
Dat de background ophoud tot an het laatste element. Dus dat niet de background tot aan de onderkant van de browser wordt gevuld, maar tot het laatste element.
Klik ik bijvoorbeeld op Ctrl + A, dan wordt de background wel tot onderaan gevuld, maar ook als ik eventueel een volgende pagina bezoek op de website, wordt de background wel tot onder aan toe geladen.

edit:
Ctrl + A, werkt inmiddels ook niet meer, meer Ctrl + R, werkt wel.

[ Voor 8% gewijzigd door JordyOnrust op 08-10-2009 11:33 ]

[.oisyn]

Bright010957 schreef op donderdag 08 oktober 2009 @ 11:30:
Margin: up, right, bottom, left.

Was dat een reactie op mijn post? Zo ja, heb je 'm überhaupt helemaal gelezen?

@Mathijs88: lost de goede volgorde je probleem eigenlijk op?

[ Voor 12% gewijzigd door .oisyn op 08-10-2009 11:33 ]

[Verwijderd]

Sorry, ik was gelijk weer druk bezig. Het is inderdaad opgelost, geweldig! Van het margin gebeuren dat "up, right, bottom, left" dat begrijp ik hardstikke goed natuurlijk. Als ik erover nadenk is het dan ook logisch dat wanneer je de background attribute gebruikt het ook in een bepaalde lees volgorde moet. In ieder geval bedankt!

Even off-topic btw:
Kan een div een link zijn zonder dat het problemen veroorzaakt? Dus bijvoorbeeld:

code:

<a href="http://www.bladiebla.nl/" target="_self"><div class="link" id="home"></div></a>

[ Voor 5% gewijzigd door Verwijderd op 08-10-2009 12:45 ]

[.oisyn]

De div is in jouw voorbeeld natuurlijk zelf geen link. Het is slechts een container om een daadwerkelijke link. Het enige probleem dat ik ermee zie is dat je link nu als block gerenderd wordt en niet inline, zolang je display property van de div niet aanpast.

.edit: ah, je hebt je post aangepast en de <div> als child van <a> gemaakt. Volgens mij mag dat niet

[ Voor 17% gewijzigd door .oisyn op 08-10-2009 12:47 ]

[MueR]

Dat mag inderdaad niet. Een div mag niet binnen <a>, <p>, <hX> of andere elementen met "inhoud". Maar dat kan de Validator je gewoon vertellen

[Verwijderd]

Bah. Het leek zo'n makkelijke oplossing . Dus ik moet gewoon het plaatje in die div gooien en daar een link van maken dan maar.

[.oisyn]

Wat wil je precies doen dan? Je kunt natuurlijk ook die hele <div> weglaten en de <a> de properties meegeven die de <div> zou hebben.

[Verwijderd]

Ik moet een paar image links maken. Ik kan die <a> ook een class geven en die gebruiken voor m'n image links natuurlijk.

edit: wat jij zei dus

[ Voor 10% gewijzigd door Verwijderd op 08-10-2009 13:24 ]

[Gersomvg]

Bright010957 schreef op donderdag 08 oktober 2009 @ 11:30:
Margin: up, right, bottom, left.

Maar ik heb met Chrome ook al meerder background problemen gehad.
Dat de background ophoud tot an het laatste element. Dus dat niet de background tot aan de onderkant van de browser wordt gevuld, maar tot het laatste element.
Klik ik bijvoorbeeld op Ctrl + A, dan wordt de background wel tot onderaan gevuld, maar ook als ik eventueel een volgende pagina bezoek op de website, wordt de background wel tot onder aan toe geladen.

edit:
Ctrl + A, werkt inmiddels ook niet meer, meer Ctrl + R, werkt wel.

Dan moet je background meegeven aan de <html> ipv de <body>

[JordyOnrust]

Gersompie schreef op vrijdag 09 oktober 2009 @ 13:02:
[...]


Dan moet je background meegeven aan de <html> ipv de <body>

Dat had ik al vaker gehoord, maar dat is eigenlijk toch vreemd?
Dat zou toch eigenlijk voorbehouden moeten zijn aan de body tag?
Met FF en IE heb ik er overigens geen last van. Beetje vreemd, maar in elk geval bedankt voor de tip.

[Sebazztiaan]

Verwijderd schreef op donderdag 08 oktober 2009 @ 13:19:
Ik moet een paar image links maken. Ik kan die <a> ook een class geven en die gebruiken voor m'n image links natuurlijk.

edit: wat jij zei dus

wel even display:block geven, of inline-block, anders heb je geen "lay-out"