Archief - HTML: div probleem

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
M

MJ!

Legacy Member
Hey,

ff een vraagje. Ik heb op mijn website een div (id: container) die alle andere divs omvat. Deze div heeft een achtergrond. Nu staat zijn width momenteel ingesteld op 100%, met als gevolg dat wanneer een gebruiker bv. zijn favorietenbalk opent (zijbalk), het scherm aangepast wordt. Er komt dan onderaan een scrollbar (logisch want de inhoud kan niet meer volledig in het venster). Wanneer ik echter naar rechts scroll loopt mijn background niet meer verder. Hij stopt dus daar waar de inhoud niet meer verder op het scherm kan.
Ik hoop dat deze uitleg duidelijk is :)
Ik begrijp dat dit te maken heeft met die "width:100%", die past nl. de div aan aan de grootte van het venster (en niet verder). Is hier een oplossing voor?

Dit is momenteel mijn css code voor de container div:

#container {
height: 500px;
background-image: url(images/nonewartistsback2.jpg);
background-repeat: repeat;
position: relative;
width: 100%;
margin-top: 50px;
margin-bottom: auto;
margin-left: 0px;
margin-right: 0px;
}

alvast bedankt!
M

MJ!

Legacy Member
repeat-x heb ik al geprobeerd, doesn't work.
En tabellen, mja ik werk sowieso liever met divs voor de lay-out... :)
s

swiFFer

Legacy Member
simpel op te lossen ze :p
verwijder het achtergrond gedoe uit uw div en verander dit in uw code

<BODY BACKGROUND="image.jpg">
:D
o

orez

Legacy Member
swiFFer zei:
simpel op te lossen ze :p
verwijder het achtergrond gedoe uit uw div en verander dit in uw code

<BODY BACKGROUND="image.jpg">
:D
Klik om te vergroten...

gelieve deftige oplossingen te geven
dit is GEEN oplossing en is zelfs niet xhtml valid..

@ts

Je dient je achtergrond wel mee te geven met je body

body {
background: ....
}

een main container div dient niet echt om je volledig scherm te gaan vullen, je zult een container div gebruiken met een fixed width om deze bv gecentreerd te zetten. Als je je bg via je body doet, kom je dit probleem niet tegen, en kan je gerust ook die 100% alles omringende div laten vallen.

@sabaoth, background-repeat: repeat; is zowel repeat-x als repeat-y dus dat is correct. Als je enkel repeat-x zou toepassen zal de backgroundtile niet meer via de y-as repeaten, wat ook wel nodig is..

Nuja @ ts... tis ook altijd beter om uw site hier te tonen, gewoon een linkje, veel eenvoudiger om het probleem te vinden ook. Want het kan nog aan meerdere zaken liggen als enkel dit.
Z

Zero Grav

Legacy Member
- Uw width verwijderen - Een div is namelijk een block element dat automatisch 100% width aanneemt.
- Aanpassen naar min-width: 100%;
- Uw background uit uw div halen en op uw background instellen

3 mogelijkheden die volgens mij alledrie zullen werken om dit probleem op te lossen. Pas ze dus niet alledrie toe hé! (Alhoewel dat ook wel zou werken maar het zou gewoon dom zijn)

En wat is dat met die antwoorden in die thread hier? Moet elke thread een grap worden over twisten tussen tabellen en divisions? Als ge enkel de interessante kunt uithangen doe het dan gewoon niet, zo help je de threadstarter echt niet.
X

Xavez

Legacy Member
Als je even de link van je pagina meegeeft denk ik dat dat al veel zal helpen, dan zien we het probleem (de achtergrond) ook écht :).
M

MJ!

Legacy Member
Alvast merci voor alle comments, ik gaf de link nie mee omdat ik nog aan de site bezig ben en ik niet graag een 'work in progress' toon :) Ik ben raar, kweetet...

http://users.pandora.be/emjeej/nOna

Hier staat de site ff online, zoals je dus ziet zit ik eigenlijk met twee backgrounds. Probeer ff een zijbalk te openen, je zal zien dat wanneer je naar rechts scrolled, de rode achtergrond niet doorloopt. De blauwe uiteraard wel aangezien die gedefinieerd is in mijn body.
X

Xavez

Legacy Member
Het is bij mij eigenlijk net omgekeerd hoor. Zonder sidebar loopt de achtergrond *niet* door :p.
M

MJ!

Legacy Member
oops sorry, had een foute versie erop gezet, das was mijn 'klooi'-versie :)
Nu zou ze er juist moeten op staan.
k

kRa

Legacy Member
Als op het einde van diene container div nog nen div toevoegd:

<div id="clear"></div>

en dan in css:

#clear {
clear: both;
}

Zo werkt da toch in verticale richting kweet nu ni wa da geeft in horizontale richting...
o

orez

Legacy Member
swiFFer , dergelijke comments hoef je mij niet te geven.
Jouw oplossing is niet valid, en niet deftig. punt.

En voor dergelijke commentaar heb je zonet een infraction ontvangen.
X

Xavez

Legacy Member
probleem: de position: absolute;

bijkomend probleem: heel jouw websitestructuur is volledig verkeerd opgebouwd. Ik denk dat je hier met tables zelfs compacter had gewerkt :D.

oplossing: Serieus dus: als je een website maakt, vertrek dan niet van de grafische achtergrond, maar van de contextuele achtergrond. Je maakt gewoon een div "menu" en een div "content", bouwt je menuutje op uit li's, zet je textparagrafen in <p>-elementen enzovoort en nadien ga je je pagina dan opmaken. Jij hebt het wel met divs gedaan, maar dan volgens "de oude methode": namelijk niet naar de semnatische waarde van de tags, maar naar wat er visueel volgens jou mogelijk mee is. Je moet met andere woorden je hele denkproces omgooien! Position: absolute; is feitelijk een van de ranzigste css-regels die er bestaan (waarom hebben ze dat ding toch ook uitgevonden :D). Als je dingen gaat positioneren doe je dat het liefst van al met margins en dan bovendien nog eens relatief ten opzichte van elkaar. Het zal je in de toekomst veel (typ)werk en enkele honderden bytes aan code besparen!
w

w3bb3r

Legacy Member
@Xavez

Ik volg nl. een multimedia richting waar we dus veel te maken hebben met website ontwikkeling e.d. .. bij de les XHTML hebben ze ons ook Position: absolute; aangeleerd.

Er is zelfs nog nooit sprake geweest van margins bij ons.
Alleen dan voor body margin 0px dat alles dan gewoon start van het bovenste linker hoekje van je browser.


Misschien dat het ook dat probleem is bij MJ!
X

Xavez

Legacy Member
Dat is het probleem inderdaad > multimedia op school zuigt. Er loopt in België volgens mij niet één leerkracht rond die behoorlijk xhtml+css beheerst :).

position: absolute; is een perfect geldige css-rule hoor ;). Het is gewoon écht een onding, maar daar ga ik niet over uitweiden want dan moet ik weer een post van vijf pagina's schrijven :D.
S

Strangler

Legacy Member
Xavez zei:
Dat is het probleem inderdaad > multimedia op school zuigt. Er loopt in België volgens mij niet één leerkracht rond die behoorlijk xhtml+css beheerst :).
Klik om te vergroten...

Op't VISO in Mariakerke leren ze dat sinds vorig jaar in 5e ;)
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan