abonnement bol.com Unibet Coolblue
pi_36288002
Is het misschien een optie om een mod de laatste post van het vorige topic aan te passen met een verwijzing naar dit topic? Of vraag ik dan teveel?

Verkapte TVP
Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.
pi_36288346
quote:
Op woensdag 22 maart 2006 17:27 schreef Desdinova het volgende:
<IFRAME SRC="hoofdpagina.html" WIDTH="100%" HEIGHT=100%" frameborder="0" name="content" scrolling="no">[knip errortekst]</IFRAME>
Dat is een oplossing, maar zorgt weer voor een ander probleem; je krijgt (logischerwijs) geen scrollbalk te zien. Maar de content is op sommige pagina's wel langer dan het iframe hoog is...

Andere oplossing? Toevoegingen?
.
pi_36289647
er staat trouwens geen dubbele quote voor 100% bij height?
quote:
<body>
<table style="border-width: 0px; width: 760px; height: 100%; border-collapse: collapse;" border="1">
<tr>
<td colspan="2" style="text-align: right; vertical-align: bottom; width: 760px; height: 129px; padding: 8px; background-image: url(images/header.jpg); background-repeat: no-repeat;">
".$menuitems."
</td>
</tr>
<tr>
<td style="vertical-align: bottom; text-align: left; width: 158px; height: 80px; padding-left: 8px; padding-bottom: 8px; background-image: url(images/left.jpg); background-repeat: no-repeat;">
<div style="width: 150px; height: 20px; overflow: hidden; text-align: left; vertical-align: bottom; padding:0px; margin:0px;">".$nav."</div>
</td>
<td rowspan="2" style="text-align: left; vertical-align: top; width: 602px; height: 100%;">
<div style="width: 600px; margin: 0px; padding: 0px; text-align: center;">".$table."</div>
</td>
</tr>
<tr>
<td style="text-align: right; width: 158px; vertical-align: top; padding-right: 8px; height: 100%; background-image: url(images/bg.jpg);">
".$submenuitems."
</td>
</tr>
</table>
</body>
waarom wordt hier de cel met $nav groter naarmate de $table groter wordt?
ik kom er ECHT niet uit.. even niet letten op incompatibiliteit met PHP want dat zit in t echte script wel snor
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36290760
quote:
Op donderdag 23 maart 2006 10:12 schreef Desdinova het volgende:
er staat trouwens geen dubbele quote voor 100% bij height?
Ah, dat is waarschijnlijk een copy/paste foutje geweest, bedankt.
niet dat het verschil maakt, maar ik houd wel van nette code
.
pi_36290903
<IFRAME SRC="hoofdpagina.html" WIDTH="100%" HEIGHT=100%" frameborder="0" name="content" scrolling="no">[knip errortekst]</IFRAME>
scrolling="no" heb ik er toch maar weer uitgehaald, aangezien ik op zijn minst wél de scrollbalken wil hebben. Maar hoe zorg ik ervoor dat Internet Explorer netjes omgaat met de inhoud?

FireFox zet dus 'goed' de verticale scrollbalk neer en zorg dat de inhoud wordt aangepast. Internet Explorer behoudt de breedte van de inhoud en plaatst DAN PAS de verticale scrollbalk. Daar komt de horizontale scrollbalk om de hoek kijken, aangezien daar te weinig ruimte voor is op dat moment.
.
pi_36291056
als je in je body van de pagina in je iframe een margin zet? margin-right: 20px; ofzo?
As a rule, I never touch anything more sophisticated and delicate than myself.
  donderdag 23 maart 2006 @ 11:24:28 #8
23170 WebForce
Kijk mij nou!
pi_36291481
Hallo! Ik heb een standaard pivot weblogje al een tijdje in beheer, maar nu kom ik er eigenlijk pas achter dat het helemaal niet lekker in elkaar zit met IE. In Firefox doet 'ie het prima...
Dit is de site. In FF ziet die er dus prima uit, maar als je in IE het venster kleiner maakt zie je dat de onderste twee kolommen (div) blijven ; staan'...

Alles zit 'in' een body, de rechter kolom heet heeft de div 'centercolumn', de rechter 'rightcolumn' en het plaatje/logo 'header'.

Zo zit een gedeelte van de css eruit:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
body {
   padding: 0px;
   width: 807px;
   background: #DDD;
   margin: auto;
}

#centercolumn {
   padding: 6px 0px;
   position: absolute;
   width: 600px;
}

#rightcolumn {
   position: absolute;
   margin-left: 600px;
   width: 205px;
}

#header {
}


Ik heb lopen zoeken hoe dat precies zit met position etc., maar ik kom er niet uit . Wie helpt?

the_disheaver, de laatste post in het vorige topic was voor mij? Want dan gaat het niet helemaal werken...
pi_36291552
quote:
Op donderdag 23 maart 2006 11:08 schreef Desdinova het volgende:
als je in je body van de pagina in je iframe een margin zet? margin-right: 20px; ofzo?
Dat maakt helaas geen verschil, IE lijkt de margin mee te rekenen als content-ruimte. Het resultaat blijft dus hetzelfde... Jij hoopte dat IE deze ruimte zou 'gebruiken' voor de verticale scrollbalk neem ik aan?
.
pi_36291566
zet om die 2 divs een container div, dan ben je klaar denk ik.
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36291629
quote:
Op donderdag 23 maart 2006 11:26 schreef Tackleberry het volgende:

[..]

Dat maakt helaas geen verschil, IE lijkt de margin mee te rekenen als content-ruimte. Het resultaat blijft dus hetzelfde... Jij hoopte dat IE deze ruimte zou 'gebruiken' voor de verticale scrollbalk neem ik aan?
dat hoopte ik ja

je zou padding-right kunnen proberen.. voor de volledigheid.


waarom pakt Opera + Netscape <body style="text-align: center;"> niet btw? hij blijft mn content links uitlijnen..
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36291651
quote:
Op donderdag 23 maart 2006 11:27 schreef Desdinova het volgende:
zet om die 2 divs een container div, dan ben je klaar denk ik.
Als je het tegen mij hebt: ik maak geen gebruik van divs en (dummie topic) wat een container div is...
.
  donderdag 23 maart 2006 @ 11:30:30 #13
23170 WebForce
Kijk mij nou!
pi_36291667
quote:
Op donderdag 23 maart 2006 11:27 schreef Desdinova het volgende:
zet om die 2 divs een container div, dan ben je klaar denk ik.
Dat is een reactie op mijn post?
pi_36291709
quote:
Op donderdag 23 maart 2006 11:30 schreef WebForce het volgende:

[..]

Dat is een reactie op mijn post?
die was op jou ja
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36291718
quote:
Op donderdag 23 maart 2006 11:29 schreef Desdinova het volgende:
dat hoopte ik ja

je zou padding-right kunnen proberen.. voor de volledigheid.
Hetzelfde resultaat, zoals verwacht.
.
  donderdag 23 maart 2006 @ 11:32:27 #16
23170 WebForce
Kijk mij nou!
pi_36291726
quote:
Op donderdag 23 maart 2006 11:32 schreef Desdinova het volgende:

[..]

die was op jou ja
En hoe moet ik dat ongeveer zien dan?
pi_36291767
quote:
Op donderdag 23 maart 2006 11:24 schreef WebForce het volgende:
Hallo! Ik heb een standaard pivot weblogje al een tijdje in beheer, maar nu kom ik er eigenlijk pas achter dat het helemaal niet lekker in elkaar zit met IE. In Firefox doet 'ie het prima...
Dit is de site. In FF ziet die er dus prima uit, maar als je in IE het venster kleiner maakt zie je dat de onderste twee kolommen (div) blijven ; staan'...

Alles zit 'in' een body, de rechter kolom heet heeft de div 'centercolumn', de rechter 'rightcolumn' en het plaatje/logo 'header'.

Zo zit een gedeelte van de css eruit:
[ code verwijderd ]

Ik heb lopen zoeken hoe dat precies zit met position etc., maar ik kom er niet uit . Wie helpt?

the_disheaver, de laatste post in het vorige topic was voor mij? Want dan gaat het niet helemaal werken...
Wat werkt er niet? Ga wel met float werken, en zeker niet met een margin van 600 px. Kijk eens hoe float werken.
pi_36291791
hehe.

als het goed is heb je iets als <div id="centercolumn">

daarvoor zet je <div>

en aan het einde ergens zou je een </div> moeten hebben. waar je nog een </div> achter zet.
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36291920
quote:
Op donderdag 23 maart 2006 11:34 schreef Desdinova het volgende:
hehe.

als het goed is heb je iets als <div id="centercolumn">

daarvoor zet je <div>

en aan het einde ergens zou je een </div> moeten hebben. waar je nog een </div> achter zet.
Zou je voor de overzichtelijkheid gebruik willen maken van de QUOTE functie van het forum?
.
pi_36291934
Eventjes een andere tip. Mocht je problemen hebben met CSS in oa Opera, download de nieuwste preview (beta) van opera 9. ( http:/labs.opera.com) het heeft onder tools > advanced > een error console waarmee je onder andere de css struikelblokken kunt vinden.
pi_36292049
quote:
Op donderdag 23 maart 2006 11:39 schreef Tackleberry het volgende:

[..]

Zou je voor de overzichtelijkheid gebruik willen maken van de QUOTE functie van het forum?
mja ik heb het net bij de ontwikkelaars gelegd om een snelquote te introduceren voor het snel reageren.
As a rule, I never touch anything more sophisticated and delicate than myself.
  donderdag 23 maart 2006 @ 11:46:48 #22
23170 WebForce
Kijk mij nou!
pi_36292094
quote:
Op donderdag 23 maart 2006 11:40 schreef the_disheaver het volgende:
Eventjes een andere tip. Mocht je problemen hebben met CSS in oa Opera, download de nieuwste preview (beta) van opera 9. ( http:/labs.opera.com) het heeft onder tools > advanced > een error console waarmee je onder andere de css struikelblokken kunt vinden.
Bij mijn site geeft ie geen errors, maar het ziet er idd belabberd uit... Help!

1
2
3
4
5
6
7
8
9
10
<body>
<div id="header">
</div>

<div id="rightcolumn">
</div>

<div id="centercolumn">
</div>
</body>

Zo ziet mijn 'frontpage' er nu uit. Wat moet ik aangeven in mijn css om de rightcolumn rechts onder de header te zetten en de centercoloum links naast de header. En dat alles gecentreerd...
pi_36292172
<body style="text-align: center;">
<center>
<div id="header">
</div>
<div style="width: 800px; margin: 0px; padding: 0px;">
<div id="centercolumn" style="float: left;"></div>
<div id="rightcolumn" style="float: left;"></div>
</div>
</body>

ik heb width: 800px; gedaan, je kan beter even kijken hoe breed je je header hebt en die breedtje gebruiken. dit kan je allemaal weer rechtstreeks in je sheet zetten natuurlijk.
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36292365
quote:
Op donderdag 23 maart 2006 11:46 schreef WebForce het volgende:

[..]

Bij mijn site geeft ie geen errors, maar het ziet er idd belabberd uit... Help!
[ code verwijderd ]

Zo ziet mijn 'frontpage' er nu uit. Wat moet ik aangeven in mijn css om de rightcolumn rechts onder de header te zetten en de centercoloum links naast de header. En dat alles gecentreerd...
WAT gaat er dan niet goed als je met float werkt? Wel de <div id="right"> onder de left zetten anders krijg je de navigatie aan de linker kant.
pi_36292424
ik heb een div met height en min-height op 100%, positioning absolute, en top op 200px. Dit creeert een scrollbalk in mn browser omdat hij eerst 100% hoogte berekent, en daarna 200px naar beneden opschuift (of iets dergelijks). Maar ik wil dus 100% - 200px. Kan dit?
As a rule, I never touch anything more sophisticated and delicate than myself.
  donderdag 23 maart 2006 @ 12:03:48 #26
52200 ViPeRII
It's a good day to die
pi_36292490
Als je nu een margin-bottom er in zet van 200px lost dat je probleem op Desdinova?
-- ViPeRII --
pi_36292539
quote:
Op donderdag 23 maart 2006 12:00 schreef Desdinova het volgende:
ik heb een div met height en min-height op 100%, positioning absolute, en top op 200px. Dit creeert een scrollbalk in mn browser omdat hij eerst 100% hoogte berekent, en daarna 200px naar beneden opschuift (of iets dergelijks). Maar ik wil dus 100% - 200px. Kan dit?
Kun je een (container)div niet om de header en dat andere ding zetten met als min-heigt 100%?
  donderdag 23 maart 2006 @ 12:18:03 #28
23170 WebForce
Kijk mij nou!
pi_36292849
Ik heb het denk ik opgelost:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
body {
   width: 808px;
   background: #DDD;
   margin-top: 5px;
   margin: 0px auto;
}

#centercolumn {
   width: 600px;
   padding-top: 6px;
   float: left;
}

#rightcolumn {
   width: 205px;
   float: right;
}

#header {
   width: 800px;
   border: 1px solid #999;
}

Idd met float dus Maar moest de centercolumn ook vertellen dat die rechts moest floaten
pi_36293100
@ ViperII
het lijkt erop van niet. Alleen in netscape en FF werkt het niet okee. Het ziet er wel goed uit, maar met het scrollwieltje is er 200pixels naar beneden te scrollen (er zijn geen scrollbalken).

@ disheaver
kan, maar werkt niet.
misschien als ik dan bij de andere divs de 100% weghaal, maar dan klopt de layout niet meer. de divs hebben een backgroundimage, en eentje draagt de content, dus die moet ook een overflow krijgen.
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36306266
tvp
Just say hi!
pi_36355301
Even een klein vraagje:
ik heb het volgende:
1
2
3
4
5
6
<td>
              <a href="" title="test1">test1</a>
              <a href="" title="test2">test2</a>
              <a href="" title="testT">testT</a>
              <span class="weekday">25</span>
</td>

Nu wil ik dat de span met weekday gepositioneerd wordt boven de a's zonder dat ik de span er in de html boven moet zetten. Iemand ideeen?
pi_36360909
Hey,

in Firefox en MSIE doet ie het prima, maar niet in Opera. Het effect van de links werkt wel, maar de kleuren niet?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
A:visited {
                    font-family: verdana, Helvetica, sans-serif;
                    font-size: 11px;color:"#624800";
                    text-decoration:none;
                   font-weight: bold;
}
A:hover {
font-family: verdana, Helvetica, sans-serif;
font-size: 11px;
color:"#846100";
text-decoration:underline;
font-weight: bold;
}
A:link {
font-family: verdana, Helvetica, sans-serif;
font-size: 11px;
color:"#624800";
text-decoration:none;
font-weight: bold;
}
A:active {
font-family: verdana, Helvetica, sans-serif;
font-size: 11px;
color:"#846100";
text-decoration:none;
font-weight: bold;
}


[ Bericht 61% gewijzigd door dewitteparel op 25-03-2006 19:01:55 (leesvriendelijk gemaakt ;)) ]
pi_36361563
je hoeft geen " om je hex codes te zetten voor kleurtjes .
pi_36361630
quote:
Op zaterdag 25 maart 2006 19:21 schreef rickmans het volgende:
je hoeft geen " om je hex codes te zetten voor kleurtjes .
geniaal , maar het werkt wel dank!
pi_36364513
Is het mogelijk om in 1 stylesheet meerdere kleuren te gebruiken voor linkjes?
Ik heb namelijk een menu waarvan de linkjes wit moeten zijn. Maar in de rest van de pagina's moeten ze zwart zijn. Maar nu blijkt dus dat het niet mogelijk is om een classe aan een a href te hangen.
Ik weet dat het kan als je gaat kutten met lists, maar ook dat voorkom ik liever.

Kortom, hoe krijg ik voor elkaar dat je met 1 stylesheet gebruik kunt maken van 2 types urls met elk andere kleuren en andere CSS attributen?
Dwz. in het menu zijn ze wit en in de rest van de pagina zwart .

[ Bericht 20% gewijzigd door blieblie op 25-03-2006 21:17:31 ]
pi_36364572
Ik ben net begonnen met css. Mijn vragen gaan zeker nog wel komen
stupidity has become as common as common sense was before
pi_36365223
@ blieblie

zet in je <a> tag een class. bijv:
<a class="white" href="etc

en in je stylesheet zet je dan:

a.white {
color: white;
}

en a.white:hover {
color: black;
}
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36365556
quote:
Op zaterdag 25 maart 2006 21:28 schreef Desdinova het volgende:
@ blieblie

zet in je <a> tag een class. bijv:
<a class="white" href="etc

en in je stylesheet zet je dan:

a.white {
color: white;
}

en a.white:hover {
color: black;
}
Jup! Dat is em . Dank je! Heerlijk is dat... Zulke makkelijke logische oplossingen en ze gewoon niet zelf verzonnen of gevonden krijgen .
  maandag 27 maart 2006 @ 17:55:30 #39
74523 BaggerUser
ModderFokker!
pi_36410555
oke hoe ga ik dit fixen met div's en css zodat het en in internet explorer en firefox werkt?



het problem is dat als paars langer wordt (content) groen en blauw ook langer moeten worden... heb nog nooit een oplossing voor dit probleem kunnen vinden, maar ik neeeem aan dat dit wel moet kunnen

het kan zelfs met tabellen maar ik wil graag divs gebruiken...

iemand die wel weet hoe dit moet ?
De enige echte BaggerUser!
Riemen
fiets kopen
pi_36413251
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
  maandag 27 maart 2006 @ 19:32:35 #41
145090 HenkBenzinetank
Toegevoegde waarde
pi_36413463
quote:
Op zaterdag 25 maart 2006 15:24 schreef rickmans het volgende:
Even een klein vraagje:
ik heb het volgende:
[ code verwijderd ]

Nu wil ik dat de span met weekday gepositioneerd wordt boven de a's zonder dat ik de span er in de html boven moet zetten. Iemand ideeen?
Volgens mij kan dat niet, omdat je HTML gebruikt voor de lay-out/volgorde van de tekst en css voor de opmaak.
  maandag 27 maart 2006 @ 21:48:20 #42
74523 BaggerUser
ModderFokker!
pi_36418092
het is me al gelukt, op een andere manier maar het werkt welliswaar
zit nu alleen nog met het probleem dat mn text langer is dan mn div, in firefox

http://80.61.232.209/essek/layout.php
De enige echte BaggerUser!
Riemen
fiets kopen
pi_36418584
Voor Firefox moet je min-height gebruiken. Als je een height opgeeft dan houdt FF zich daar ook echt aan.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
  maandag 27 maart 2006 @ 22:10:57 #44
74523 BaggerUser
ModderFokker!
pi_36418835
heb nu een min-height opgegeven maar nu komt die div over de onderliggende div heen.. dat is ook niet de bedoeling.

http://80.61.232.209/essek/layout.php
De enige echte BaggerUser!
Riemen
fiets kopen
pi_36429288
hoe krijg ik iets in het vertikale midden van een div?
Ben dit probleem al een aantal keer tegen gekomen..
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36443319
Ik heb een container met daarin een menu en een inhoud div
De menu div is 16px breed en de inhoud begint op 165px. Maar als het menu 'klaar' is dan loopt de tekst in de inhoud ineens een stuk terug. Dit in meerdere ua's. Weet iemand wat dat is? Of nog beter, wat ik kan doen om dat op te lossen?

-- Al gefixt

[ Bericht 6% gewijzigd door wonko op 29-03-2006 13:11:43 ]
Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.
  woensdag 29 maart 2006 @ 02:57:30 #47
46275 Castor
Obey the rules, miss the fun
pi_36453356
quote:
Op maandag 27 maart 2006 22:10 schreef BaggerUser het volgende:
heb nu een min-height opgegeven maar nu komt die div over de onderliggende div heen.. dat is ook niet de bedoeling.

http://80.61.232.209/essek/layout.php
Haal height weg uit .CONTENT_WRAPPER. En zorg ervoor dat je background-image hoog genoeg is voor je content of stop er ook een achtergrond kleur in.

Bijvoorbeeld:
1
2
3
.CONTENT_WRAPPER {
width: 760px;
background:#62E8F9 url(images/background.bmp) repeat-x top left;}   
  woensdag 29 maart 2006 @ 03:16:25 #48
46275 Castor
Obey the rules, miss the fun
pi_36453406
quote:
Op dinsdag 28 maart 2006 11:49 schreef Desdinova het volgende:
hoe krijg ik iets in het vertikale midden van een div?
Ben dit probleem al een aantal keer tegen gekomen..
De oplossing is relatief eenvoudig (maar wel lastig te begrijpen), en je hebt helaas een extra "container" div nodig. Het kan echter wel... Ja ook in IE.

Check: http://www.jakpsatweb.cz/css/css-vertical-center-solution.html
  woensdag 29 maart 2006 @ 03:27:10 #49
46275 Castor
Obey the rules, miss the fun
pi_36453437
quote:
Op zaterdag 25 maart 2006 15:24 schreef rickmans het volgende:
Even een klein vraagje:
ik heb het volgende:
[ code verwijderd ]

Nu wil ik dat de span met weekday gepositioneerd wordt boven de a's zonder dat ik de span er in de html boven moet zetten. Iemand ideeen?
Dit is een mogelijke oplossing:
1
2
td {position:relative;}
td span {position:absolute;top:0;left:0;}


Ik hoorde dat het voor Opera ook wel handig is om er een z-index in te zetten als je relative/absolute positioning gebruikt.
  Redactie Games woensdag 29 maart 2006 @ 23:16:19 #50
52557 crew  Mr.Noodle
Offtopic in geleuter...
pi_36479080
Iemand nog een idee hoe je een List met verticale tekst in CSS krijgt? verwerkt in tabjes? Ik had een oplossing gevonden, alleen die is lelijk en werkt alleen in IE.
Als in:
T|
a|
b|
1|

T|
a|
b|
2|
How do you get precisely 4 Gallons of water with a 3 Gallon and 5 Gallon Can...
  donderdag 30 maart 2006 @ 00:54:21 #51
46275 Castor
Obey the rules, miss the fun
pi_36481907
quote:
Op woensdag 29 maart 2006 23:16 schreef Mr.Noodle het volgende:
Iemand nog een idee hoe je een List met verticale tekst in CSS krijgt? verwerkt in tabjes? Ik had een oplossing gevonden, alleen die is lelijk en werkt alleen in IE.
Als in:
T|
a|
b|
1|

T|
a|
b|
2|
Ik zou gewoon images gebruiken. Het zit nog niet standaard in CSS. Ik geloof wel dat het een recommendation is voor CSS3, maar dat duurt nog wel even.
pi_36489841
Ik ben bezig met een site en ik ben nog niet zo thuis in CSS en HTML. Maar met vallen en opstaan komen we er wel.

Ik heb een ideetje, en het gaat tot op bepaalde hoogte goed, maar ergens loopt het mis. Misschien wil ik ook dingen die helemaal niet kunnen, maar dat hoor ik dan ook graag.

Dit is het idee:



Op zich gaat dat best goed. Maar eigenlijk wil ik dat de balken bovenaan, dus boven de container waar de tekst in staat, doorlopen naar rechts, als er van een hogere resolutie gebruikt wordt gemaakt. Omdat het menuutje een image is, is dit moeilijk. Ik dacht dat ik het kon oplossen door de image uit elkaar te halen en in verschillende divjes te plaatsen, zodat ik die naar rechts kon laten doorlopen. Maar dat schijnt niet te werken. Of wel?

Het zou dan ook nog best eens ingewikkeld kunnen worden; Het witte van de banner, dat donkerblauwe lijntje, daaronder dus die lichtblauwe balk, vervolgens weer een wit lijntje, dan een grijs lijntje, weer een wit lijntje, grijze balk en weer een wit lijntje. Wat doe ik mezelf ook aan...

Overigens heb ik de URL van het plaatje in mijn stylesheet verwerkt, maar het is uiteindelijk de bedoeling dat de buttons klikbaar worden. Kan dat via een stylesheet, of moet dat echt in de HTML pagina staan?

Nou ja, zo maar een paar vraagjes van een dummie.
pi_36492298
@madguy
als je de menuitems uit de div haalt en er een a-tag van maakt met dezelfde style opmaak is als het goed is je hele plaatje clickable.

verder snap k niet wat je wilt
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36493806
Oeh ja, dat klinkt eigenlijk wel logisch.

Wel, wat ik wil. Het menu gedeelte heb ik Banner genoemd in het plaatje hierboven. Bij een hogere resolutie dan 1024x768 houdt het plaatje natuurlijk rechts een keer op. Ik wil eigenlijk voor het mooie dat de kleuren rechts doorlopen bij een hogere resolutie.



Dit plaatje dus. Alle streepjes en dingetjes moeten doorlopen. Geen repeat-code dus, maar slechts de kleuren. Hoe pak ik dit slim aan, of wordt dat te ingewikkeld of onmogelijk om uit te voeren?
pi_36493859
quote:
Op donderdag 23 maart 2006 09:11 schreef Tackleberry het volgende:

[..]

Dat is een oplossing, maar zorgt weer voor een ander probleem; je krijgt (logischerwijs) geen scrollbalk te zien. Maar de content is op sommige pagina's wel langer dan het iframe hoog is...

Andere oplossing? Toevoegingen?
Wat heeft een iframe met CSS te maken?
pi_36494018
quote:
Op donderdag 30 maart 2006 15:16 schreef MadGuy het volgende:
Oeh ja, dat klinkt eigenlijk wel logisch.

Wel, wat ik wil. Het menu gedeelte heb ik Banner genoemd in het plaatje hierboven. Bij een hogere resolutie dan 1024x768 houdt het plaatje natuurlijk rechts een keer op. Ik wil eigenlijk voor het mooie dat de kleuren rechts doorlopen bij een hogere resolutie.

[afbeelding]

Dit plaatje dus. Alle streepjes en dingetjes moeten doorlopen. Geen repeat-code dus, maar slechts de kleuren. Hoe pak ik dit slim aan, of wordt dat te ingewikkeld of onmogelijk om uit te voeren?
Ik doen jou niet begrijp?
pi_36494900
quote:
Op donderdag 30 maart 2006 15:21 schreef super-muffin het volgende:

[..]

Ik doen jou niet begrijp?
Ik denk dat hij bedoelt dat de de achtergrond kleur van de div moet doorlopen tot dezelfde breedte als de boven c.q onderliggende div.
Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.
pi_36494972
quote:
Op donderdag 30 maart 2006 15:17 schreef super-muffin het volgende:
Wat heeft een iframe met CSS te maken?
Dit gebeurde naar aanleiding van een CSS 'oplossing'...
.
pi_36495901
quote:
Op donderdag 30 maart 2006 15:16 schreef MadGuy het volgende:
Oeh ja, dat klinkt eigenlijk wel logisch.

Wel, wat ik wil. Het menu gedeelte heb ik Banner genoemd in het plaatje hierboven. Bij een hogere resolutie dan 1024x768 houdt het plaatje natuurlijk rechts een keer op. Ik wil eigenlijk voor het mooie dat de kleuren rechts doorlopen bij een hogere resolutie.

[afbeelding]

Dit plaatje dus. Alle streepjes en dingetjes moeten doorlopen. Geen repeat-code dus, maar slechts de kleuren. Hoe pak ik dit slim aan, of wordt dat te ingewikkeld of onmogelijk om uit te voeren?
aah op die manier. als je de laatste div op width: 100% zet, en een background-repeat: repeat-x; erin zet?

edit
je moet wel ff 6e div aanmaken net na het einde van je laatste menubutton.

oh en waarom geen repeat code?
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36497189
Omdat je dan een repeat krijgt van het plaatje, toch? Dat wil ik juist niet. Ik wil slechts dat de kleuren doorlopen, alsof het balken zijn.

Ik geloof dat ik het te moeilijk uitleg ook.

Ik heb op dit moment vijf div's: Top, Banner, Banner2, Left en Container.

Banner is de div waar het gehele plaatje instaat:



Dit plaatje dus.

Ik wil juist dat alle elementen doorlopen naar rechts bij een eventuele hogere resolutie. Top is geen probleem. DE achtergrondkleur is zwart en width staat op 100%. Hetzelfde geldt voor Banner2. Maar nu wil ik dat ook voor het plaatje in Banner. Probleem is dat het een plaatje is en ik niet wil dat het herhaalt wordt. Ik zal dus de achtergrondkleuren mooi over moeten laten lopen...

Dat wil ik dus.
pi_36497399
over laten lopen lijkt me een veel moeilijkere klus dan van die ene banner wat meerdere kleine te maken.

bijvoorbeeld;
men neme 1 pixel breed van de banner die je nu hebt, de meest linkse pixel bijvoorbeeld. en dat 54 pixels hoog, of hoe hoog je banner ook is. Deze zet je in een div met repeat-x en width 100%. Deze loopt nu van links naar rechts. hierin zet je een center, en vervolgens de aparte menuitems elk in een eigen div (of a met background image).

dat lijkt mij de meest geschikte oplossing
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_36500300
Bedankt voor de suggestie. Ik ga gewoon even verder puzzelen.
pi_36507531
Ook AR heeft weer een vraagje.

Site=> http://www.jarnonieuwenhuize.nl

En ja, de kleuren worden binnenkort veranderd

Maarrrrr, wat ik eigenlijk wil is dat het menu bovenaan in een documentje staat zonder frames te gebruiken. Kan dat met css

(Oftewel, kan ik een tekstgebaseerdmenu in een externe css-sheet opnemen?)
  vrijdag 31 maart 2006 @ 01:14:05 #64
62215 qu63
..de tijd drinkt..
pi_36513095
ola

ik zit met een irritant k*t probleem. mn site is helemaal door de "keuring" van w3c gekomen ( ), dat wil ik ook graag behouden natuurlijk . Het probleem is dus dat het "tekst" gedeelte van de site in Firefox gewoon tegen het menu aan staat, maar in IE niet enig idee hoe dat te doen is met css en/html iets anders?
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
  vrijdag 31 maart 2006 @ 01:46:54 #65
62215 qu63
..de tijd drinkt..
pi_36513469
het gaat dan dus om http://www.ahrenstravel.nl
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
pi_36513519
style="table-layout:fixed;" en dan de kolommen/cells een vaste breedte geven.
  vrijdag 31 maart 2006 @ 14:47:00 #67
62215 qu63
..de tijd drinkt..
pi_36524335
thanks!

nu nog een vraagje over het euro-teken.. hoe kan ik dat gebruiken zonder dat w3c validator begint te zeuren over mn tekens?


You have used an illegal character in your text. HTML uses the standard UNICODE Consortium character repertoire, and it leaves undefined (among others) 65 character codes (0 to 31 inclusive and 127 to 159 inclusive) that are sometimes used for typographical quote marks and similar in proprietary character sets. The validator has found one of these undefined characters in your document. The character may appear on your browser as a curly quote, or a trademark symbol, or some other fancy glyph; on a different computer, however, it will likely appear as a completely different character, or nothing at all.

Your best bet is to replace the character with the nearest equivalent ASCII character, or to use an appropriate character entity. For more information on Character Encoding on the web, see Alan Flavell's excellent HTML Character Set Issues reference.

This error can also be triggered by formatting characters embedded in documents by some word processors. If you use a word processor to edit your HTML documents, be sure to use the "Save as ASCII" or similar command to save the document without formatting information.
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
pi_36524444
gaat hij over de zeik van een &euro;?
  vrijdag 31 maart 2006 @ 14:59:11 #69
62215 qu63
..de tijd drinkt..
pi_36524712
quote:
Op vrijdag 31 maart 2006 14:50 schreef Roönaän het volgende:
gaat hij over de zeik van een €?
jup
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
pi_36524796
je kan nog de unicode proberen. Geen idee hoe die precies loopt. Iets van
&u1234; Zou je het nummer even op moeten zoeken.
  vrijdag 31 maart 2006 @ 15:12:16 #71
62215 qu63
..de tijd drinkt..
pi_36525011
quote:
Op vrijdag 31 maart 2006 15:01 schreef Roönaän het volgende:
je kan nog de unicode proberen. Geen idee hoe die precies loopt. Iets van
&u1234; Zou je het nummer even op moeten zoeken.
U20A is dat

maar heb nergens kunnen vinden hoe ik die neer moet zetten, als ik het met &# ervoor doe wordt het *blokje*20A
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
pi_36525151
en zonder het sharp-sign?
  vrijdag 31 maart 2006 @ 15:18:57 #73
62215 qu63
..de tijd drinkt..
pi_36525225
1& # x 2 0 a c ;


die werkt wel en wordt gepakt door de validator!
zonder de spaties dus
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
  vrijdag 31 maart 2006 @ 15:22:01 #74
62215 qu63
..de tijd drinkt..
pi_36525306
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
  vrijdag 31 maart 2006 @ 17:30:16 #75
145090 HenkBenzinetank
Toegevoegde waarde
pi_36529270
O ja, ik zit ook nog met een probleempje met mijn site (zie ). Ik wil dit plaatje als bg van mijn menu:
.
Het is heel netjes een <ul>-menu en op de een ofandere manier werkt
1
2
3
4
#navlist li
{
   background-image: url(/img/menuitembg);
}

of een code die er op lijkt, niet.
  zaterdag 1 april 2006 @ 02:32:36 #76
46275 Castor
Obey the rules, miss the fun
pi_36542790
quote:
Op vrijdag 31 maart 2006 17:30 schreef HenkBenzinetank het volgende:
O ja, ik zit ook nog met een probleempje met mijn site (zie [afbeelding]). Ik wil dit plaatje als bg van mijn menu:
[afbeelding].
Het is heel netjes een <ul>-menu en op de een ofandere manier werkt
[ code verwijderd ]

of een code die er op lijkt, niet.
Dit zou moeten werken:
1
2
#navlist li {background:url(http://www.fontanel.nl/img/menuitembg.gif) 
no-repeat top left; width:80px;}
  zaterdag 1 april 2006 @ 02:39:12 #77
46275 Castor
Obey the rules, miss the fun
pi_36542861
quote:
Op donderdag 30 maart 2006 22:18 schreef Autoreply het volgende:
Ook AR heeft weer een vraagje.

Site=> http://www.jarnonieuwenhuize.nl

En ja, de kleuren worden binnenkort veranderd

Maarrrrr, wat ik eigenlijk wil is dat het menu bovenaan in een documentje staat zonder frames te gebruiken. Kan dat met css

(Oftewel, kan ik een tekstgebaseerdmenu in een externe css-sheet opnemen?)
Neen, wat jij wilt kan niet met CSS. Hier zou je zgn "includes" voor kunnen gebruiken. Dat kan bijvoorbeeld met PHP, MS FrontPage of Dreamweaver (templates).
pi_36580451
Ik weer.

Uiteraard nog steeds dezelfde site: http://www.jarnonieuwenhuize.nl/

Hoe krijg ik de witregel onder bijvoorbeeld kopjes weg? Dit lijkt te hangen op < h2 > tekst < / h2 >

Hierna wordt automatisch een witregel toegepast
pi_36580642
Dat ligt aan de margins die standaard op een H2 en P zitten.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_36582214
quote:
Op zondag 2 april 2006 16:21 schreef SuperRembo het volgende:
Dat ligt aan de margins die standaard op een H2 en P zitten.
En kan je die veranderen?
pi_36594396
Hoe krijg ik van 2 divjes die left zijn gefloat de ene net zo hoog als de ander.

<div id="left"></div>
<div id="right"></div>

Met float: leftl krijg ik hem naast elkaar. Maar hoe krijg ik de right-div net zo hoog als de left div als er in de left-div meer tekst staat? (in right-div is een achtergrondskleur ingesteld)
pi_36595504
quote:
Op zondag 2 april 2006 23:17 schreef the_disheaver het volgende:
Hoe krijg ik van 2 divjes die left zijn gefloat de ene net zo hoog als de ander.

<div id="left"></div>
<div id="right"></div>

Met float: leftl krijg ik hem naast elkaar. Maar hoe krijg ik de right-div net zo hoog als de left div als er in de left-div meer tekst staat? (in right-div is een achtergrondskleur ingesteld)
gelukt, en wel hiermee: http://www.positionisever(...)uelayout/equalheight
pi_36612421
quote:
Op zondag 2 april 2006 23:52 schreef the_disheaver het volgende:

[..]

gelukt, en wel hiermee: http://www.positionisever(...)uelayout/equalheight
Werkt toch niet perfect in Opera, en totaal niet in IE

Iemand een andere oplossing?

edit: toch opgelost geloof ik.

Met wat aanpassingen, http://www.alistapart.com/articles/fauxcolumns/

[ Bericht 15% gewijzigd door the_disheaver op 03-04-2006 17:33:57 ]
  maandag 3 april 2006 @ 17:01:42 #84
145090 HenkBenzinetank
Toegevoegde waarde
pi_36612575
quote:
Op zondag 2 april 2006 17:24 schreef Autoreply het volgende:

[..]

En kan je die veranderen?
tuurlijk.
Margin: 0px;
pi_36820199
Ik ben verder wezen klooien met mijn ontwerp en kwam tot het volgende:



Nu heb ik een tweeledig probleem.

Het eerste is het donkerblauwe vlak links. Deze div wil ik door laten lopen zolang als de pagina verticaal is. Dit varieert per pagina. De 100% value werkt niet. Want dan laat de browser hem doorlopen tot het einde van het scherm, maar zodra je naar beneden scrollt, krijg je weer de background-color. Hoe kan ik dit handig oplossen?

Het tweede probleem betreft het menu boven. Omdat ik de pagina ook mooi uit wil laten komen op hogere resoluties, zijn de verschillende elementen uit het menu van onder naar boven aparte divjes.



Dus dan heb je van onder naar boven: een zwarte balk, de 'tijdlijn', de verschillende menu elementen (die ook weer per button een divje zijn) en een grijze balk. Deze wil ik door laten lopen naar rechts, zolang als de pagina wordt. Bij 1024x768 als resolutie is dit natuurlijk 1024, maar bij hogere resoluties wordt het meer. Maar ook value 100% werkt hier niet. Ze stoppen dan gewoon op een gegeven moment. Sterker nog, ik heb nu een horizontale scrollbar. Aaargh.

Ik pak iets gigantisch fout aan, maar wat?
  dinsdag 11 april 2006 @ 01:31:10 #86
46275 Castor
Obey the rules, miss the fun
pi_36844928
quote:
Op maandag 10 april 2006 13:26 schreef MadGuy het volgende:
Ik ben verder wezen klooien met mijn ontwerp en kwam tot het volgende:

[afbeelding]

Nu heb ik een tweeledig probleem.

Het eerste is het donkerblauwe vlak links. Deze div wil ik door laten lopen zolang als de pagina verticaal is. Dit varieert per pagina. De 100% value werkt niet. Want dan laat de browser hem doorlopen tot het einde van het scherm, maar zodra je naar beneden scrollt, krijg je weer de background-color. Hoe kan ik dit handig oplossen?
Dit kun je eenvoudig oplossen door een 1 a 2px hoog en (zo breed als je het donkerblauwe vlak wilt) brede background-image (.gif) in je body te plakken met een repeat-y

Misschien niet de mooiste oplossing, maar wel de makkelijkste.
quote:
Het tweede probleem betreft het menu boven. Omdat ik de pagina ook mooi uit wil laten komen op hogere resoluties, zijn de verschillende elementen uit het menu van onder naar boven aparte divjes.

[afbeelding]

Dus dan heb je van onder naar boven: een zwarte balk, de 'tijdlijn', de verschillende menu elementen (die ook weer per button een divje zijn) en een grijze balk. Deze wil ik door laten lopen naar rechts, zolang als de pagina wordt. Bij 1024x768 als resolutie is dit natuurlijk 1024, maar bij hogere resoluties wordt het meer. Maar ook value 100% werkt hier niet. Ze stoppen dan gewoon op een gegeven moment. Sterker nog, ik heb nu een horizontale scrollbar. Aaargh.

Ik pak iets gigantisch fout aan, maar wat?
Het zou flink helpen als je een url opgeeft waar we de HTML en CSS kunnen bekijken. Nu is het heel lastig te bepalen waar het precies misgaat...
pi_36848080
Dank, Castor. Maar ik snap je eerste suggestie toch niet helemaal. Bedoel je nu in mijn CSS-bestand of in mijn HTML-bestand?

CSS
HTML

Het gaat om #left voor de linker donkerblauwe div. Deze moet zo groot worden als de pagina 'hoog' is.

En de #timeline2, #blueline, #bluewhiteline2, #menuelement2, #doublewhiteline en #grayband divjes. Die lopen zoals je ziet in mijn HTML pagina door naar rechts, maar ik wil juist dat deze eindigen aan het einde van het scherm (bij een resolutie van 1024x768). Maar als iemand een grotere resolutie gebruikt, wil ik dat ze wel doorlopen, als je begrijpt wat ik bedoel.

Ik ben een ontzettende n00bie op het gebied van CSS en HTML, dus als er suggesties voor verbetering zijn hoor ik het graag. Er zullen genoeg slordigheden en fouten inzitten.
pi_36848252
Het linkervlak links kan je doen met een 200px blauwe border-left op je content div.

Of door een plaatje te maken waarvan de linker 200 pixels blauw zijn en die als achtergrond image te gebruiken

-r-
pi_36848623
En dan repeat-y bij jouw laatste suggestie, neem ik aan? Het rare is dat dat juist niet schijnt te werken. Ik doe denk ik iets fout.

Bedankt voor de suggesties, wel.
pi_36848676
Dat is omdat je background op left hebt gedefinieerd. Probeer bijvoorbeeld eens die background op de body te zetten:

body {
background: #666 url(http://members.chello.nl/msluymers/images/main/darkbluebg.gif) repeat-y;
pi_36848927
Hm ja, dat werkt inderdaad. Maar als ik rechts nu een andere kleur wil hebben? Zou ik daar dan een aparte div voor moeten creeëren?

Thanks again, btw!

[ Bericht 9% gewijzigd door MadGuy op 11-04-2006 10:54:53 ]
pi_36849178
quote:
Op dinsdag 11 april 2006 10:48 schreef MadGuy het volgende:
Hm ja, dat werkt inderdaad. Maar als ik rechts nu een andere kleur wil hebben? Zou ik daar dan een aparte div voor moeten creeëren?
Of de achtergrondimage danwel kleur aanpassen.
pi_36849584
Thanks. Dat moet nu wel gaan lukken, denk ik. Staat alleen het andere probleem nog.
pi_36850678
Hoe komt het overigens dat IE alles zo raar in elkaar drukt, terwijl Firefox het geheel perfect weergeeft? Vooral bij de grijze balk boven en de tekstballon banner boven mijn content is het goed te zien - het is net een tikkeltje verschoven...
pi_36920335
Toch even een kickje.

Waarom lopen de divjes bovenaan naar rechts zo afwisselend door? Ik wil juist dat deze vergroten en verkleinen naarmate de resolutie die gebruikt wordt door de gebruiker groter of kleiner is. Is hier een oplossing voor?

Het tweede probleem is Internet Explorer. In Firefox en Netscape onder andere wordt de grootte van de container perfect weergegeven. Hij valt onder de lichtblauwe banner en is er perfect mee uitgelijnd. In IE is dit echter niet het geval. Ook de grijze balk bovenaan wordt in IE overlapt door de lichtblauwe banner. Kan ik dit rechttrekken?

pagina
CSS
pi_36922449
Ik heb zo 1-2-3 geen antwoord, maar waarom doe je alles met absolute positionering? Daar krijg je alleen maar grijze haren van...
Ich fälle Bäume und hupf und spring, steck Blumen in die Vas
Ich schlupf in Frauenleider, und lummel mich in Bars
  donderdag 13 april 2006 @ 15:17:04 #97
25889 Sitethief
Fulltime Flapdrol
pi_36922750
Ik ben bezig met het uitproberen van mijn layout. Alleen nu staat echt alles in HTML en ik wil toch graag een gedeelte in CSS hebben.
Hoe krijg ik het background element(niet eens legal0 uit een <td> in CSS?

Zie: http://sitethief.nl/try/
Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht &gt;:)
pi_36922823
quote:
Op donderdag 13 april 2006 15:17 schreef Sitethief het volgende:
Ik ben bezig met het uitproberen van mijn layout. Alleen nu staat echt alles in HTML en ik wil toch graag een gedeelte in CSS hebben.
Hoe krijg ik het background element(niet eens legal0 uit een <td> in CSS?

Zie: http://sitethief.nl/try/
td {background-color: #123456;}
pi_36923459
quote:
Op donderdag 13 april 2006 15:07 schreef Berkery het volgende:
Ik heb zo 1-2-3 geen antwoord, maar waarom doe je alles met absolute positionering? Daar krijg je alleen maar grijze haren van...
Hm ja, dat klopt wel een beetje. Ik wil echter dat mijn ontwerp hetzelfde is bij iedereen.

Wat zou je anders voorstellen dan?
  donderdag 13 april 2006 @ 15:56:58 #100
46794 Berkery
Fat bastard
pi_36924172
quote:
Op donderdag 13 april 2006 15:38 schreef MadGuy het volgende:

[..]

Hm ja, dat klopt wel een beetje. Ik wil echter dat mijn ontwerp hetzelfde is bij iedereen.

Wat zou je anders voorstellen dan?
Je zou hier een beetje mee kunnen spelen (menu): http://www.alistapart.com/articles/taminglists/

En voor de rest is het een kwestie van netjes centreren.
Ich fälle Bäume und hupf und spring, steck Blumen in die Vas
Ich schlupf in Frauenleider, und lummel mich in Bars
pi_36924802
quote:
Op donderdag 13 april 2006 14:03 schreef MadGuy het volgende:

Waarom lopen de divjes bovenaan naar rechts zo afwisselend door? Ik wil juist dat deze vergroten en verkleinen naarmate de resolutie die gebruikt wordt door de gebruiker groter of kleiner is. Is hier een oplossing voor?
je DIV met id '#menuelement2' heeft een absolute positie van 'left: 779px;' en de breedte is 'width:100%'

Dat betekent dat de breedte van dat element de viewbox wordt en dat is in dit geval het venster zelf, je krijgt dus altijd een lelijke verticale scrollbar en dat element steekt rechts uit...

het probleem is eigenlijk al je code opzet, dat kruent onder een vorm van DIV-geilheid, oftewel teveel nutteloze div-jes, die vervolgens allemaal een harde absolute positiering krijgen ...

wil je een goede opzet hebben, moet je beginnen met een gestroomlijnde, nette code opzet, gebruik zo min mogelijk verschillende tags en zeker het liefste niet voor 'lege' elementen ...

als voorbeeld hier een andere opzet, vooral van de HTMLcode van de header, waarbij de html-code minimaal gehouden is en puur met CSS bepaalde structuren gezet (niet zo'n typische 'slicing' opzet dus maar structruele HTML)
http://judi.kw.nl/uploads/fok/temp/
"Whatever you feel like: Life’s not one color, nor are you my only reader" - Ausonius, Epigrammata 25
pi_36925123
Bedankt voor de site, Berkery. Die ga ik zeker eens uitpluizen.

@ RM-f. Bedankt zeg! Ik heb de pagina opgeslagen en ik ga het vanavond even nader bekijken. Het ziet er wel veel logischer uit.

Ik ben nog slechts een CSS/ HTML n00bie en ik stel enorme prijs op dit soort hulp.
pi_37091655
Ik ben bezig met een site en heb een probleem. De layout is verschillend in IE 6/5.5 tov IE 7, FF Opera etc.

Dit is de HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
[<html>
<head>
<title>Welkom op mijn website!</title>
<style type="text/css">
<!--
#Layer2 {
   position:relative;
   width:72%;
   height:40px;
   background-color: #00337F;
   border-bottom: 2px solid #FF993F;
   border-right: 2px solid #FF993F;
   margin: 0px;
   padding: 0px;   
}
#Layer3 {
   position:relative;
   width:100%;
   height:50px;
   background-color:#FFFFFF;
   text-align:left;
   padding:0px;
   margin:0px;
   }
#banner {
   margin-bottom: 20px;
   border: 1px solid #00337F;
   text-align: left;
   background-color:#FFFFFF;
   height:110px;
   padding: 0px;
   }
h1.title {
font-family:bitsream vera serif;
font-size:2.3em;
margin:0px;
padding:0px;
font-weight: bolder;
color:#00337F;
position:relative;
top:8px;
left:60px;
}
img.logo {
position:relative;
top:-70px;
left:75%;
width:110px;
}
#menu_container
{
   position:relative;
   width:100%;
   height:20px;
   background-color:#FF993F;
}
-->
</style>
</head>
<body>
<div id="banner"><div id="Layer2"></div>
<div id="Layer3"><h1 class="title">Mijn Domein</h1>
<img class="logo" src="images/logo.jpg" alt="logo"/></div>
<div id="menu_container"></div></div>
</body>
</html>


Hoe kan ik dit soort verschillen het best wegwerken?
pi_37092318
Wat is er verschillend? moeten we dat raden?

als het een probleem met het boxmodel is, mozilla/Opera en IE6 bij valide pagina's met correct DOCTYPE een ander boxmodel inpassen als msie5 en 5.5, en msie6 in quirky mode...
het kan soms helpen om voor mozilla de CSS box-sizing:border-box tioe te passen, mozilla volgt dan eigenlijk de foute rendering van explorer....

een andere optie zijn de ettelijke box-model hacks of workarounds...
"Whatever you feel like: Life’s not one color, nor are you my only reader" - Ausonius, Epigrammata 25
pi_37095637
quote:
Op woensdag 19 april 2006 12:40 schreef RM-rf het volgende:
Wat is er verschillend? moeten we dat raden?

als het een probleem met het boxmodel is, mozilla/Opera en IE6 bij valide pagina's met correct DOCTYPE een ander boxmodel inpassen als msie5 en 5.5, en msie6 in quirky mode...
het kan soms helpen om voor mozilla de CSS box-sizing:border-box tioe te passen, mozilla volgt dan eigenlijk de foute rendering van explorer....

een andere optie zijn de ettelijke box-model hacks of workarounds...
Er is een verschil in de grote van `layout 2` onder IE en FF. In FF is hij de de 50px hoog die hij moet zijn in IE is hij echter 2 keer zo groot.
Ik zal even zoeken op boxmodel om te kijken of dat het probleem is.
pi_37100465
die DIV#banner heeft een height van 110 px en een bottom-margin van 20px....

in explorer blijft de hoogte 110px en wordt de margin aan de onderkant daar gewoon weer bij opgeteld (border-box-model)...
terwijl volgens het officiele model de opgegeven hoogte altijd inclusief margins-paddings en border moet zijn.... oftewel de binnenruimte van de box is in mozilla/firefox/opera en msie6 in valid mode 90px (110px - 20px margin: het box-sizing-model)

Dat is idd een box-model probleem.
"Whatever you feel like: Life’s not one color, nor are you my only reader" - Ausonius, Epigrammata 25
pi_37121325
quote:
Op woensdag 19 april 2006 17:11 schreef RM-rf het volgende:
die DIV#banner heeft een height van 110 px en een bottom-margin van 20px....

in explorer blijft de hoogte 110px en wordt de margin aan de onderkant daar gewoon weer bij opgeteld (border-box-model)...
terwijl volgens het officiele model de opgegeven hoogte altijd inclusief margins-paddings en border moet zijn.... oftewel de binnenruimte van de box is in mozilla/firefox/opera en msie6 in valid mode 90px (110px - 20px margin: het box-sizing-model)

Dat is idd een box-model probleem.
Dank je wel voor je reactie.
Ik heb gisteren niet echt veel tijd gehad maar ga er vandaag aan werken. Ik laat straks wel even weten of het gelukt is.
pi_37124067
Ik ben nu even aan het spelen geweest met de boxmodel theorie. Maar volgens mij ligt hier het probleem daar niet. Het probleem zit em in het logo. Om een of andere reden maakt IE extra ruimte onder het plaatje. Dit gebeurt in FF niet.

Hoe krijg ik die ruimte weg onder het logo?

Edit-------------

Ik heb deoplossing gevonden. Door het logo absolute te positioneren en de rest relative was het probleem opgelost.

[ Bericht 21% gewijzigd door ExCibular op 20-04-2006 19:52:08 ]
  FOK!-Schrikkelbaas donderdag 20 april 2006 @ 21:01:15 #109
1972 Swetsenegger
Egocentrische Narcist
pi_37139994
Waarom werkt dit niet in FF

.naam {
position:relative;
height:100px;
overflow:visible;
}

Firefox toont de overflow wel, maar volgens mij zou de box met de overflow mee moeten groeien toch?

Als ik height door min-height vervang werkt het wel in firefox, maar niet in IE
pi_37142434
quote:
Op donderdag 20 april 2006 21:01 schreef Swetsenegger het volgende:
Waarom werkt dit niet in FF

.naam {
position:relative;
height:100px;
overflow:visible;
}

Firefox toont de overflow wel, maar volgens mij zou de box met de overflow mee moeten groeien toch?

Als ik height door min-height vervang werkt het wel in firefox, maar niet in IE
Ik kan uit de CSS specificatie niet halen dat de box mee zou moeten groeien.

En IE behandelt height als min-height, da's niet helemaal volgens de specs.

Hoe lijkt:
1
2
3
4
5
.naam {
        position:relative;
   height:100px;
   min-height:100px;
}
  FOK!-Schrikkelbaas donderdag 20 april 2006 @ 22:22:51 #111
1972 Swetsenegger
Egocentrische Narcist
pi_37143887
quote:
Op donderdag 20 april 2006 21:54 schreef Light het volgende:

[..]

Ik kan uit de CSS specificatie niet halen dat de box mee zou moeten groeien.

En IE behandelt height als min-height, da's niet helemaal volgens de specs.

Hoe lijkt:
[ code verwijderd ]
Volgens handleiding html zou de box mee moeten groeien, maar dat is dus niet het geval ben ik nu ook achter.

Ik heb dus min-height nodig. Dat ondersteunt IE niet.
Dus heb ik inderdaad het zelfde geprobeerd als wat jij nu post. Maar dan maakt firefox het weer gewoon max 100px.

Kortom, ik heb een box nodig van minimaal 100px hoog, maar indien de content groter is moet hij mee groeien met de content.
  FOK!-Schrikkelbaas donderdag 20 april 2006 @ 22:24:48 #112
1972 Swetsenegger
Egocentrische Narcist
pi_37143976
Opgelost. Ik heb de meest smerige hack ooit toegepast denk ik.
min-height van 100px voor firefox.
en in de box float ik nu een divje van 100px height en 1 px width voor IE.
pi_37144252
Met de underscore hack:

1
2
_height: 100px;/* IE5/6 */
min-height: 100px; /* other */

Ondersteunt IE7beta nou inmiddels min-height of niet?
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_37145109
Ik heb een pagina met aan elke kant een balk van 20px.

Die zet ik neer voor Safari en FF als :
1
2
position:fixed; 
left:0px; 

en dat gaat perfect. En dit gebruik ik voor IE, de underscore hack dus.

1
2
3
_position:absolute; 
_left:expression(document.body.scrollTop+document.body.clientHeight-
this.clientHeight); 

maar dat werkt niet. Ik heb dan een scrollbalk horizontaal, die er niet horen te staan. En hoe meer ik naar beneden scroll, hoe meer de balken naar het midden komen.

de bovenste en onderste doen het wel goed.
Dit staat gewoon in een class die #links heet, in de pagina is het gewoon <div id="links"></div> en ze staan in de code boven de content.
pi_37145339
Een voorbeeldje zou handig zijn
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
  FOK!-Schrikkelbaas donderdag 20 april 2006 @ 23:07:50 #116
1972 Swetsenegger
Egocentrische Narcist
pi_37145927
quote:
Op donderdag 20 april 2006 22:31 schreef SuperRembo het volgende:
Met de underscore hack:
[ code verwijderd ]

Ondersteunt IE7beta nou inmiddels min-height of niet?
Negeert firefox de underscore?
pi_37146269
quote:
Op donderdag 20 april 2006 22:55 schreef SuperRembo het volgende:
Een voorbeeldje zou handig zijn
http://62.212.92.93/~danielpunt/blah/



en ja, FF negeert die underscore. Nadeel is wel dat je CSS niet meer valide is, maar jammer dan.

[ Bericht 29% gewijzigd door super-muffin op 21-04-2006 15:38:01 ]
pi_37146972
quote:
Op donderdag 20 april 2006 23:07 schreef Swetsenegger het volgende:

[..]

Negeert firefox de underscore?
IE5/6 negeert alleen de underscore en ziet "height", en die property bestaat wel.
Andere browsers negeren de property waar een underscore in zit, omdat de property "_height" niet bestaat.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_37147094
@super-muffin
Waarom heb je die expressions ook op left en right? Geeft wel een grappig effect trouwens
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_37162668
Oke, ik heb het nu zo ver dat die balken links en rechts blijven staan, maar als ik scroll lopen ze niet door.

Als ik thuis ben zal ik het ff oploaden, heb hier geen internet op mn laptop.
pi_37162748
quote:
Op donderdag 20 april 2006 22:24 schreef Swetsenegger het volgende:
Opgelost. Ik heb de meest smerige hack ooit toegepast denk ik.
min-height van 100px voor firefox.
en in de box float ik nu een divje van 100px height en 1 px width voor IE.
What about:

1
2
3
height:auto !important;
min-height:100px;
height:100px;
  FOK!-Schrikkelbaas vrijdag 21 april 2006 @ 16:53:37 #122
1972 Swetsenegger
Egocentrische Narcist
pi_37164912
@roonaan.

Ik dacht een dusdanige consturctie geprobeerd te hebben, maar die ga ik nog even testen. Kan niet gelijk wat zeggen, want het staat al live, dus ik moet even op input wachten
pi_37193143
Ik ben bezig met een lijst die ik met CSS wat wil aanpassen.
De horizontale tussenruimte is echter te groot.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<HTML>
<HEAD>
<TITLE>CSS</TITLE>

<STYLE type=text/css>
ul {
  list-style: none;
  margin: 0;
}
ul li {
  width: 100px;
  line-height: 40px;
  background: red;
  text-align: middle;
  vertical-align: text-bottom;
  border:5px solid black;
}

</STYLE>
<body>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
</ul>

</BODY></HTML>
pi_37193673
dan zet je de line-height naar bv 20px.
pi_37193945
Hmm dat bedoelde ik niet. Ik zie net dat mn post ook niet echt duidelijk was.
Het probleem is dat de border overal 5px is, maar tussen de rechthoeken is de border 10px.
pi_37198980
Ik heb in css dit:

1
2
3
4
5
.container2 {
    color: #FFFFFF;
    background-color: #000000;
    border-right: 1px solid #660000;    
}


En in de index een div met de class:

1
2
3
<div class="container2">
test
</div>


En toch laat hij geen border zien... Kan iemand me helpen?
pi_37199537
Daar is niets mis mee. De fout moet ergens anders zitten.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_37199606
quote:
Op zaterdag 22 april 2006 20:20 schreef mrbombastic het volgende:
Hmm dat bedoelde ik niet. Ik zie net dat mn post ook niet echt duidelijk was.
Het probleem is dat de border overal 5px is, maar tussen de rechthoeken is de border 10px.
Dat was idd niet duidelijk.
Misschien helpt border-collapse: collapse. Ik weet niet of dat toegestaan is op li's.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_37203528
iemand enig idee voor een mooi beginnersboek css?
  zondag 23 april 2006 @ 03:22:04 #130
44679 Leshy
Held met sokken.
pi_37203665
quote:
Op zaterdag 22 april 2006 20:20 schreef mrbombastic het volgende:
Hmm dat bedoelde ik niet. Ik zie net dat mn post ook niet echt duidelijk was.
Het probleem is dat de border overal 5px is, maar tussen de rechthoeken is de border 10px.
Dit komt omdat de li's aan alle kanten een border hebben van 5px. Als je er dus twee tegen elkaar zet, krijg je er een border van 5px + 5px tussen. Je kunt eventueel het volgende toevoegen:

1
2
3
4
ul li {
[...]
margin-bottom: -5px;
}

Dit zorgt ervoor dat de li's steeds 5 pixels over de bovenstaande heen worden gerenderd, wat het probleem met de dubbele borders oplost. Enigszins cru, maar effectief.
quote:
Op zondag 23 april 2006 03:09 schreef Misanthropist het volgende:
iemand enig idee voor een mooi beginnersboek css?
Persoonlijk vind ik de "[...] voor dummies" serie vaak erg goed, ongetwijfeld is er ook eentje voor CSS.
pi_37205457
quote:
Op zondag 23 april 2006 03:09 schreef Misanthropist het volgende:
iemand enig idee voor een mooi beginnersboek css?
Kijk eens naar Jeffrey Zeldman...goed boek...ook als e-book te bestellen bij de lokale internet verdeler.
Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.
pi_37207743
quote:
Op zondag 23 april 2006 03:22 schreef Leshy het volgende:

[..]

Dit komt omdat de li's aan alle kanten een border hebben van 5px. Als je er dus twee tegen elkaar zet, krijg je er een border van 5px + 5px tussen. Je kunt eventueel het volgende toevoegen:
[ code verwijderd ]

Dit zorgt ervoor dat de li's steeds 5 pixels over de bovenstaande heen worden gerenderd, wat het probleem met de dubbele borders oplost. Enigszins cru, maar effectief.
[..]
Dat is wel een heel lelijke oplossing.
Makkelijkste is om de UL zelf een bottom-border te geven en de LI-elementen allemaal niet.

Zoiets als dit dus:

1
2
3
4
5
6
7
8
9
UL {
 border-bottom: 1px solid #000;
}

UL LI {
 border-style: solid;
 border-color: #000;
 border-width: 1px 1px 0px 1px;
}


[ Bericht 8% gewijzigd door CrazyByte op 23-04-2006 12:55:26 ]
pi_37208609
Dan moet je er wel voor zorgen dat de ul en li even breed zijn.
Jammer dat IE geen :first-child ondersteunt, dat zou de mooiste oplossing zijn.
bottom-border moet border-bottom zijn, en er ontbreekt een ;
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_37208937
quote:
Op zondag 23 april 2006 12:50 schreef SuperRembo het volgende:
Dan moet je er wel voor zorgen dat de ul en li even breed zijn.
Jammer dat IE geen :first-child ondersteunt, dat zou de mooiste oplossing zijn.
bottom-border moet border-bottom zijn, en er ontbreekt een ;
Heb het aangepast

De LI zijn allemaal even breed (gezien de css), dus alleen een kwestie van die breedte ook even opgeven bij de UL.
pi_37209716
Dan zou ik de breedte alleen op de ul zetten. Voor Firefox moet je de padding op de ul op 0 zetten.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
  zondag 23 april 2006 @ 15:31:39 #136
44679 Leshy
Held met sokken.
pi_37214756
quote:
Op zondag 23 april 2006 12:21 schreef CrazyByte het volgende:
Dat is wel een heel lelijke oplossing.
Makkelijkste is om de UL zelf een bottom-border te geven en de LI-elementen allemaal niet.
Je hebt groot gelijk

Zo zie je maar kinderen, geen CSS om vijf uur 's nachts na het drinken
pi_37230338
Wat doe ik hier fout waardoor het er niet uit ziet in IE? Gebruik opera of firefox om te zien hoe het er uit behoort te zien.
pi_37231602
Ik zie geen verschillen (FF1.5 / IE6, Win2k)
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
pi_37234539
Heu? Bij mij ziet het er zo uit:
  maandag 24 april 2006 @ 02:42:33 #140
46275 Castor
Obey the rules, miss the fun
pi_37234544
quote:
Op zondag 23 april 2006 23:36 schreef Nevermind het volgende:
Wat doe ik hier fout waardoor het er niet uit ziet in IE? Gebruik opera of firefox om te zien hoe het er uit behoort te zien.
IE6 heeft problemen met het correct renderen van transparante png's. Lees bijvoorbeeld dit artikel of zoek naar andere artikelen .
pi_37234594
quote:
Op maandag 24 april 2006 02:42 schreef Castor het volgende:

[..]

IE6 heeft problemen met het correct renderen van transparante png's. Lees bijvoorbeeld dit artikel of zoek naar andere artikelen .
Dat heeft met alpha transparancy te maken. Met gifs zie ik geen verschil. Maar dat SR het niet ziet snap ik niet. Zie jij wel hetzelfde als ik in IE6?
  maandag 24 april 2006 @ 02:50:03 #142
46275 Castor
Obey the rules, miss the fun
pi_37234629
quote:
Op maandag 24 april 2006 02:47 schreef Nevermind het volgende:

[..]

Dat heeft met alpha transparancy te maken. Met gifs zie ik geen verschil. Maar dat SR het niet ziet snap ik niet. Zie jij wel hetzelfde als ik in IE6?
Verdomd, je hebt gelijk

Ik zie idd hetzelfde als jij in IE6. Ik gebruik WinXP Home Edition (SP2). Ik ga nog eens verder kijken wat er aan de hand kan zijn.
pi_37234648
quote:
Op maandag 24 april 2006 02:50 schreef Castor het volgende:

[..]

Verdomd, je hebt gelijk

Ik zie idd hetzelfde als jij in IE6. Ik gebruik WinXP Home Edition (SP2). Ik ga nog eens verder kijken wat er aan de hand kan zijn.
Ik gebruik ook XP. Hebben we in ieder geval een verschil met SR. Het zal wel iets met marges te maken hebben, maar die staan allemaal op 0. Als ik dat ga veranderen werkt het uiteraard niet meer in andere browsers Vaag probleem.

-edit- Met Win2k-IE6 heb ik exact dezelfde fout
  maandag 24 april 2006 @ 03:40:10 #144
46275 Castor
Obey the rules, miss the fun
pi_37234955
quote:
Op maandag 24 april 2006 02:52 schreef Nevermind het volgende:

[..]

Ik gebruik ook XP. Hebben we in ieder geval een verschil met SR. Het zal wel iets met marges te maken hebben, maar die staan allemaal op 0. Als ik dat ga veranderen werkt het uiteraard niet meer in andere browsers Vaag probleem.

-edit- Met Win2k-IE6 heb ik exact dezelfde fout
De volgende CSS op .star-rating helpt al een beetje:
1overflow:hidden;

Ik ben nu verder aan het kijken naar de background-position van .star-rating li.current-rating.
pi_37234984
quote:
Op maandag 24 april 2006 03:40 schreef Castor het volgende:

[..]

De volgende CSS op .star-rating helpt al een beetje:
[ code verwijderd ]

Ik ben nu verder aan het kijken naar de background-position van .star-rating li.current-rating.
Gaaf dat je mee-nachtbraakt Ik teste je oplossing even, en het zag er inderdaad anders uit, maar nog niet plausibel. Ik kom net een minuut geleden achter de oplossing! Ik heb de 'top-center-bottom'-waarden vervangen door de waarden in pixels, en nu werkt het wel
  maandag 24 april 2006 @ 03:57:09 #146
46275 Castor
Obey the rules, miss the fun
pi_37235012
quote:
Op maandag 24 april 2006 03:46 schreef Nevermind het volgende:

[..]

Gaaf dat je mee-nachtbraakt Ik teste je oplossing even, en het zag er inderdaad anders uit, maar nog niet plausibel. Ik kom net een minuut geleden achter de oplossing! Ik heb de 'top-center-bottom'-waarden vervangen door de waarden in pixels, en nu werkt het wel
Och, voor mij is nog niet zo laat (zit op Aruba, 6 uur eerder hier). Goed dat je de oplossing hebt gevonden! Had idd zo'n vermoeden dat het daaraan lag

>edit< Heb je al in FF gekeken? Daar is het niet helemaal goed meer. Misschien kun je beter je oplossing alleen voor IE toepassen...

>edit2< IE is ook niet helemaal goed, hij kapt de image af aan de onderkant...
  maandag 24 april 2006 @ 04:02:58 #147
46275 Castor
Obey the rules, miss the fun
pi_37235025
Vraag me niet waarom, maar als je de orginele code pakt en daar de volgende regels aan toe voegt, dan zou hij het moeten doen in IE en FF:

1
2
3
4
5
* html .star-rating li a:hover{
background: url(images/stars.gif) repeat-x 0% 114%;}

* html .star-rating li.current-rating { background: url(images/stars.gif) 
repeat-x 0% 56%;}
pi_37235040
quote:
Op maandag 24 april 2006 04:02 schreef Castor het volgende:
Vraag me niet waarom, maar als je de orginele code pakt en daar de volgende regels aan toe voegt, dan zou hij het moeten doen in IE en FF:
[ code verwijderd ]
Ik krijg daarbij weer een stukje van de gele sterren onderaan het plaatje
Ik ga toch maar even slapen, kan ik morgen wat helderder denken. Bedankt voor al je hulp!

-edit- Hoe werkt deze bij je?
  maandag 24 april 2006 @ 04:21:20 #149
46275 Castor
Obey the rules, miss the fun
pi_37235063
quote:
Op maandag 24 april 2006 04:09 schreef Nevermind het volgende:

[..]

Ik krijg daarbij weer een stukje van de gele sterren onderaan het plaatje
Ik ga toch maar even slapen, kan ik morgen wat helderder denken. Bedankt voor al je hulp!

-edit- Hoe werkt deze bij je?
Oeps, vergat te zeggen "orginele code" + "mijn *html oplossing" + "overflow:hidden op .star-rating".

Maar volgens mij werkt je laatste oplossing (rating3.html) goed in zowel FF als IE!
pi_37279901
Wie kan mij vertellen waarom de #content niet door loopt in FF als de tekst te lang word?
In IE is het wel goed.

http://www.danielpunt.nl/temp.htm
pi_37281409
misschien is dit wel eerder geroepen maar kijk anders eens bij css zen http://www.csszengarden.com/

daar staan zoveel IE en FF hacks... Zeeer goede site
They execute an american tourist, we tactically nuke an entire city...
pi_37282279
Oh, het is al opgelost.

Ik heb bij #vol en bij #content de height: 100% weggehaalt
pi_37283687
oh nee, dan is het weer niet goed als het niet in de pagina past.

dan moet toch min-height voldoen? (+ de hack voor IE?)
pi_37291243
Klopt het dat in IE6 en FF de font-size niet wordt geërfd door tabellen?
In onderstaand voorbeeld krijg ik dat de bovenste regel tekst groter wordt weergegeven dan de onderste.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<html>

<head>

<style>
html, body {
   font-family: Georgia, "Times New Roman", Times, serif;
   font-size: 12px;
}
</style>

</head>

<body>
<table>
   <tr>
      <td>Deze tekst is groter dan onderstaande.</td>
   </tr>
</table>

Deze tekst is kleiner dan bovenstaande tekst.
</body>

</html>
pi_37295649
quote:
Op vrijdag 21 april 2006 15:38 schreef super-muffin het volgende:
Oke, ik heb het nu zo ver dat die balken links en rechts blijven staan, maar als ik scroll lopen ze niet door.

Als ik thuis ben zal ik het ff oploaden, heb hier geen internet op mn laptop.
http://danielpunt.nl/2/

  woensdag 26 april 2006 @ 15:53:58 #156
53267 TC03
Catch you on the flipside
pi_37314076
Weet niet of het bekend is maar wou dit toch even zeggen, ik vind dit echt een perfecte hack om dingen speciaal voor IE te speciferen.

1
2
3
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="voor_ie.css" />
<![endif]-->


Zo handig.
Ten percent faster with a sturdier frame
pi_37320298
Kun je dat ook in je CSS bestand zetten?
maar dan als
1
2
3
<!--[ if IE 6] >
@import ('stijl_ie.css')
<![ endif -->


en hoe doe je dat voor alle versies op IE? Of alle versies lager dan 6?
  donderdag 27 april 2006 @ 03:33:57 #158
46275 Castor
Obey the rules, miss the fun
pi_37334433
quote:
Op dinsdag 25 april 2006 20:30 schreef mrbombastic het volgende:
Klopt het dat in IE6 en FF de font-size niet wordt geërfd door tabellen?
In onderstaand voorbeeld krijg ik dat de bovenste regel tekst groter wordt weergegeven dan de onderste.
[ code verwijderd ]
Dat komt doordat je geen DOCTYPE neerzet, dan werken de browsers in quirksmode. De volgende code moet het oplossen:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!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>

<style type="text/css">
/*<![CDATA[*/
html, body {
   font-family: Georgia, "Times New Roman", Times, serif;
   font-size: 12px;

}
/*]]>*/
</style>
<title></title>
</head>
<body>
<table>
<tr>
<td>Deze tekst is groter dan onderstaande.</td>
</tr>
</table>
<p>Deze tekst is kleiner dan bovenstaande tekst.</p>

</body>
</html>
pi_37355629
quote:
Op donderdag 27 april 2006 03:33 schreef Castor het volgende:

[..]

Dat komt doordat je geen DOCTYPE neerzet, dan werken de browsers in quirksmode. De volgende code moet het oplossen:
[ code verwijderd ]
Ah oke, weer wat geleerd .
pi_37356449
Net ook erachter gekomen dat FF itt tot IE geen spaties tussen een nummer en een eenheid accepteert. Zo is left:480 px uit den boze.
pi_37367139
net zoald een border bij IE buiten de div valt en bij FF in de div...
  vrijdag 28 april 2006 @ 10:59:27 #162
69950 MadGuy
Fever Ray
pi_37370518
quote:
Op vrijdag 28 april 2006 04:37 schreef Misanthropist het volgende:
net zoald een border bij IE buiten de div valt en bij FF in de div...
Dat vind ik inderdaad erg naar. Volgens mij gaat IE hier tegen de standaard in toch? Waarom?! WAAAAROM?!
  vrijdag 28 april 2006 @ 11:19:50 #163
46794 Berkery
Fat bastard
pi_37371106
quote:
Op woensdag 26 april 2006 15:53 schreef TC03 het volgende:
Weet niet of het bekend is maar wou dit toch even zeggen, ik vind dit echt een perfecte hack om dingen speciaal voor IE te speciferen.
[ code verwijderd ]

Zo handig.
Als we PPK mogen geloven is dat ook de enige hack die je nodig hebt. Behalve als je nog rekening houdt met NS 4.x of IE 5 voor de Mac
Ich fälle Bäume und hupf und spring, steck Blumen in die Vas
Ich schlupf in Frauenleider, und lummel mich in Bars
  FOK!-Schrikkelbaas vrijdag 28 april 2006 @ 11:48:20 #164
1972 Swetsenegger
Egocentrische Narcist
pi_37371838
quote:
Op vrijdag 28 april 2006 04:37 schreef Misanthropist het volgende:
net zoald een border bij IE buiten de div valt en bij FF in de div...
volgens mij toch alleen in quircksmode?
pi_37405679
ik ben bezig met een website met een fluid design.
Nou heb ik header en een footer die precies doen wat ik wil alleen het lukt me nog niet goed om het middenstuk voor elkaar te krijgen.

1
2
3
4
5
6
7
8
9
#home {
   margin-bottom: 20px;
   border: 2px solid #00337F;
   text-align: left;
   background-color:#FFFFFF;
   height: 350px;
   padding: 0px;
   overflow:invisible;
   }

In dexe container wil ik een stuk tekst die fluid is en twee kolommen met een vaste breedte van 225px. Alleen het lukt mij niet echt om die kolommen goed voor elkaar te krijgen dat ze er mooi naast staan.

Ik dacht het op deze manier te doen:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
#tekst
{
float:left;
margin-right:450px;}

#column1{
position:relative;
width:250px;
border-left:1px solid black;
float:right;
padding:0px;
margin:0px
}
#column2{
position:relative;
float:right;
border-left:1px solid black;
padding:0px;
margin:0px
}


Heeft iemand een idee wat ik fout doe?
  zondag 30 april 2006 @ 04:06:34 #166
46275 Castor
Obey the rules, miss the fun
pi_37420026
quote:
Op zaterdag 29 april 2006 16:54 schreef ExCibular het volgende:
ik ben bezig met een website met een fluid design.
Nou heb ik header en een footer die precies doen wat ik wil alleen het lukt me nog niet goed om het middenstuk voor elkaar te krijgen.
[ code verwijderd ]

In dexe container wil ik een stuk tekst die fluid is en twee kolommen met een vaste breedte van 225px. Alleen het lukt mij niet echt om die kolommen goed voor elkaar te krijgen dat ze er mooi naast staan.

Ik dacht het op deze manier te doen:
[ code verwijderd ]

Heeft iemand een idee wat ik fout doe?
Ik begrijp niet helemaal wat je voor elkaar probeert te krijgen, vaak helpt het als je de HTML en volledige CSS post of linkt. Maar "overflow: invisible" bestaat iig niet. Dat moet zijn "overflow: hidden;"
pi_37433932
sorry het moet zijn overflow visible, typefoutje gemaakt.
html is vrij simpel div home is de container met daarin de 3 divjes die de content moeten verzorgen (div als container met daarin inhoud om event. box model problemen te voorkomen).
Ik heb niet echt een voorbeeld kunnen vinden. Maar ik heb even een plaatje gemaakt van wat ik wil bereiken


Afhankelijk van de lengte van de teksten in de kolommen of in de tekst moet de alles langer zijn dan 350 px.

[ Bericht 11% gewijzigd door ExCibular op 30-04-2006 20:06:16 ]
  zaterdag 6 mei 2006 @ 22:59:57 #168
46275 Castor
Obey the rules, miss the fun
pi_37616197
quote:
Op zondag 30 april 2006 19:58 schreef ExCibular het volgende:
sorry het moet zijn overflow visible, typefoutje gemaakt.
html is vrij simpel div home is de container met daarin de 3 divjes die de content moeten verzorgen (div als container met daarin inhoud om event. box model problemen te voorkomen).
Ik heb niet echt een voorbeeld kunnen vinden. Maar ik heb even een plaatje gemaakt van wat ik wil bereiken
[afbeelding]

Afhankelijk van de lengte van de teksten in de kolommen of in de tekst moet de alles langer zijn dan 350 px.
Is dit wat je bedoeld?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!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>
<title></title>

<style type="text/css">
/*<![CDATA[*/
  #home {float:left;border:1px solid red;}
  #tekst {background-color:yellow;float:left;margin-right:450px;}
  #column1 {width:225px;background-color:lightblue;float:left;margin-left:-450px;}
  #column2 {width:225px;background-color:blue;float:left;margin-left:-225px;}
/*]]>*/
</style>
</head>
<body>
<div id="home">
<div id="tekst">Nam vel nisi vitae odio congue tempus. Etiam leo justo,
 interdum dictum, accumsan at, accumsan quis, nisl. Sed ipsum orci, 
eleifend sit amet, congue ac, nonummy et, metus. Ut mollis mauris ac lectus. 
</div>
<div id="column1">Column 1</div>
<div id="column2">Column 2</div>
</div>
</body>
</html>
pi_37775305
De basis van CSS(tutor van w3schools) ken ik wel, maar ik denk nog altijd in tabellen ipv div's. Eigenlijk gebruik ik bijna overal tabellen voor wat eigenlijk niet goed is, hier wil ik dus vanaf.

Weet iemand een goede tutorial over het indelen van je website dmv CSS? Of kan iemand me een voorbeeldje geven.

Neem nou bijvoorbeeld een contactformuliertje. Dit zet ik altijd in een tabel omdat alles dan netjes oonder elkaar en uitgelijnd is. Hoe zou ik zoiets in CSS kunnen aanpakken?
pi_37778528
quote:
Op vrijdag 12 mei 2006 23:20 schreef Da_Koen het volgende:
De basis van CSS(tutor van w3schools) ken ik wel, maar ik denk nog altijd in tabellen ipv div's. Eigenlijk gebruik ik bijna overal tabellen voor wat eigenlijk niet goed is, hier wil ik dus vanaf.

Weet iemand een goede tutorial over het indelen van je website dmv CSS? Of kan iemand me een voorbeeldje geven.

Neem nou bijvoorbeeld een contactformuliertje. Dit zet ik altijd in een tabel omdat alles dan netjes oonder elkaar en uitgelijnd is. Hoe zou ik zoiets in CSS kunnen aanpakken?
Je zou een divje kunnnen nemen met een bepaalde width. En deze voor elke divje gelijk brengen. Ernaast via float een divje erbij. Maar dit is niet ideaal aangezien je afhankelijk van de (breedte) van de inhoud ook de breedte van de eerste kolom wilt varieren.

Tabelgebruik daarvoor is gewoon wel gewoon beter.

Layout van de pagina zelf, en tekstvlakken waar je een object in wilt gooien, daar heb je css voor nodig.

div is net als table html-code. Dus als je met CSS bezig wilt zijn is het niet per definitie fout om een tabel te gebruiken.
  zaterdag 13 mei 2006 @ 01:25:42 #171
46275 Castor
Obey the rules, miss the fun
pi_37778760
quote:
Op vrijdag 12 mei 2006 23:20 schreef Da_Koen het volgende:
De basis van CSS(tutor van w3schools) ken ik wel, maar ik denk nog altijd in tabellen ipv div's. Eigenlijk gebruik ik bijna overal tabellen voor wat eigenlijk niet goed is, hier wil ik dus vanaf.

Weet iemand een goede tutorial over het indelen van je website dmv CSS? Of kan iemand me een voorbeeldje geven.

Neem nou bijvoorbeeld een contactformuliertje. Dit zet ik altijd in een tabel omdat alles dan netjes oonder elkaar en uitgelijnd is. Hoe zou ik zoiets in CSS kunnen aanpakken?
Forms zijn wel een van de lastigere dingen om mee te beginnen in CSS. Je kunt hier een goed voorbeeld vinden hoe je form met CSS maakt.

Persoonlijk heb ik daar nog steeds wel moeite mee, vooral als je input fields niet even lang mogen zijn en als je ook nog een stel radio-buttons kwijt moet.
  zaterdag 13 mei 2006 @ 01:25:53 #172
46275 Castor
Obey the rules, miss the fun
pi_37809760
quote:
Op zaterdag 13 mei 2006 01:25 schreef Castor het volgende:

[..]

Forms zijn wel een van de lastigere dingen om mee te beginnen in CSS. Je kunt hier een goed voorbeeld vinden hoe je form met CSS maakt.

Persoonlijk heb ik daar nog steeds wel moeite mee, vooral als je input fields niet even lang mogen zijn en als je ook nog een stel radio-buttons kwijt moet.
Thx, zelf heb ik deze ook nog gevonden. Dat begrijp ik nu wel.


Dan nog een vraagje. Als ik het goed heb betekent "em" de hoogte van een lettertype? Maar wat betekent width:4em; dan precies? Kan iemand me dat uitleggen?
pi_37809972
1em = 16 pixels.
  zondag 14 mei 2006 @ 11:37:42 #175
33189 RM-rf
1/998001
pi_37810147
quote:
Op vrijdag 12 mei 2006 23:20 schreef Da_Koen het volgende:
De basis van CSS(tutor van w3schools) ken ik wel, maar ik denk nog altijd in tabellen ipv div's. Eigenlijk gebruik ik bijna overal tabellen voor wat eigenlijk niet goed is, hier wil ik dus vanaf.

Weet iemand een goede tutorial over het indelen van je website dmv CSS? Of kan iemand me een voorbeeldje geven.

Neem nou bijvoorbeeld een contactformuliertje. Dit zet ik altijd in een tabel omdat alles dan netjes oonder elkaar en uitgelijnd is. Hoe zou ik zoiets in CSS kunnen aanpakken?
de beste truc is te leren je HTML-code semantisch op te zetten .... daarmee leer je om bij de opzet van je HTML code niet te denken aan de layout zelf, maar een logische structuur ervoor te bedenken, de consequent is en klopt met de informatie en elementen die je erin wilt verwerken ....

Pas daarna voeg je de gewenste Layout door CSS toe:

een formulier bv:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<form>
   <fieldset>
       <legend>Mijn formulier</legend>
        <ul> 
               <li> <label for="input1">Eerste input</label>
                       <input name="mein_input" id="input1"> </li>
               <li> <label for="input2">Eerste input</label>
                       <input name="meer_input" id="input2"> </li>
               <li> <label for="input3">Eerste input</label>
                       <input name="laatste_input" id="input3"> </li>
                <li> <button type="submit">Verstuur</button> </li>
        </ul>
   </fieldset>
</form>


het mooi uitlijnen van zulke een formulier kun je doen door de CSS:
1
2
LABEL { display: block; float: left; width: 100px; }
UL, LI { list-style: none; margin:0; padding: 0; }


meer over semantiek vind je bv op alistapart (goed tutorials) en verschillende sites over css (en zoeken op semantics of semantiek)
quote:
Op zondag 14 mei 2006 11:25 schreef Da_Koen het volgende:

Dan nog een vraagje. Als ik het goed heb betekent "em" de hoogte van een lettertype? Maar wat betekent width:4em; dan precies? Kan iemand me dat uitleggen?
'em' (en 'ex') zij maateenheden die beide afhankelijk zijn van het gekozen font en de fontgrootte:
De 'em' is eigenlijk de letterbreedte (gebaseerd op de breedte van de letter 'm', veelal de breedste letter), de 'ex' is de corpshoogte (gebaseerd op de letter 'x' welke precies de undercast-hoogte aangeeft)
kies je voor de em of ex als maateenheid, weet je redelijk zeker dat je amaat gerelateerd is aan je gekozen font... zou je de font vergoten schaal je box netjes mee ... dat is de grond waaro mensen zo'n maat kiezen (bv bij het aangeven van spatierings-maat of lijnhoogte, kiezen goede designers het liefste voor resp. em of ex.

[ Bericht 14% gewijzigd door RM-rf op 14-05-2006 11:52:02 ]
"Whatever you feel like: Life’s not one color, nor are you my only reader" - Ausonius, Epigrammata 25
pi_37810282
quote:
Op zondag 14 mei 2006 11:32 schreef the_disheaver het volgende:
1em = 16 pixels.
In feite is em dus overbodig?
pi_37810880
nee, want als je je font grootte in px definieert kan het niet geschaald worden in IE door de gebruiker.
pi_37812550
quote:
Op zondag 14 mei 2006 11:32 schreef the_disheaver het volgende:
1em = 16 pixels.
1em heeft niet een vaste grootte, het is relatief. 1em geeft aan dat de lettergrootte 100% van de lettergrootte op die plek is. Uitleggen is lastig, een voorbeeld helpt waarschijnlijk meer:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<html>
<head><title>Font size</title>
<style>
body {
  font-size: 1em;
}
.a {
  font-size: 1.5em;
}
.b {
  font-size: 0.8em;
}
.c {
  font-size: 1em;
}
</style>
</head>
<body>
X<span class="a">A</span><span class="b">B</span><span class="c">C</span>X<br>
X<span class="a">A<span class="b">B<span class="c">C</span></span></span>X<br>
X<span class="a">A</span><span class="b">B<span class="c">C</span></span>X<br>
</body>
</html>


Let op het verschil in grootte van de letters C, terwijl de ze allemaal in een class c staan en dus een grootte 1em hebben. De letters X zijn op iedere regel even groot.
pi_37815286
quote:
Op zondag 14 mei 2006 13:02 schreef Light het volgende:

[..]

1em heeft niet een vaste grootte, het is relatief. 1em geeft aan dat de lettergrootte 100% van de lettergrootte op die plek is. Uitleggen is lastig, een voorbeeld helpt waarschijnlijk meer:
[ code verwijderd ]

Let op het verschil in grootte van de letters C, terwijl de ze allemaal in een class c staan en dus een grootte 1em hebben. De letters X zijn op iedere regel even groot.
Thx, dat is een duidelijk verhaal.

Maar waarom gebruikt men vaak width:4em;?? Heeft dit enkel te maken met het handmatig aanpassen van de fontsize in de browser? Dat de afstanden dan goed blijven?

edit:
Het beste zou dus zijn om je hele site in "em" te maken ipv "px"?

[ Bericht 5% gewijzigd door Da_Koen op 14-05-2006 16:24:51 ]
  zondag 14 mei 2006 @ 18:23:33 #180
46275 Castor
Obey the rules, miss the fun
pi_37820894
quote:
Op zondag 14 mei 2006 15:00 schreef Da_Koen het volgende:

[..]

Thx, dat is een duidelijk verhaal.

Maar waarom gebruikt men vaak width:4em;?? Heeft dit enkel te maken met het handmatig aanpassen van de fontsize in de browser? Dat de afstanden dan goed blijven?

edit:
Het beste zou dus zijn om je hele site in "em" te maken ipv "px"?
Klopt, als je de hele site in "em" maakt dan is hij compleet resizable als de tekst vergroot wordt.
pi_37822681
quote:
Op zondag 14 mei 2006 15:00 schreef Da_Koen het volgende:

[..]

Thx, dat is een duidelijk verhaal.

Maar waarom gebruikt men vaak width:4em;?? Heeft dit enkel te maken met het handmatig aanpassen van de fontsize in de browser? Dat de afstanden dan goed blijven?

edit:
Het beste zou dus zijn om je hele site in "em" te maken ipv "px"?
Als je zou willen dat alles mee schaalt wel.
  FOK!-Schrikkelbaas maandag 15 mei 2006 @ 17:37:12 #182
1972 Swetsenegger
Egocentrische Narcist
pi_37850247
http://webshop.xploise.nl/test/menu.htm

Bovenstaand voorbeeld is prima in FF. In zowel Opera als Internet explorer, zit er ruimte tussen de submenu's en ontbreekt de onderste border bij het laatste child. Het laatste wordt met een DOM object opgelost, maar werkt dusduidelijk niet op IE en Opera

Alle CSS en javascript staat in de html. Misschien dat iemand wat tips heeft om het menuutje crossbrowser mooi te krijgen.
pi_37854720
quote:
Op maandag 15 mei 2006 17:37 schreef Swetsenegger het volgende:
http://webshop.xploise.nl/test/menu.htm

Bovenstaand voorbeeld is prima in FF. In zowel Opera als Internet explorer, zit er ruimte tussen de submenu's en ontbreekt de onderste border bij het laatste child. Het laatste wordt met een DOM object opgelost, maar werkt dusduidelijk niet op IE en Opera

Alle CSS en javascript staat in de html. Misschien dat iemand wat tips heeft om het menuutje crossbrowser mooi te krijgen.
1 ding: in opera 9 (beta 1) zit er geen ruimte tussen de submenu's. Wel geen border onderin
  FOK!-Schrikkelbaas maandag 15 mei 2006 @ 23:25:46 #184
1972 Swetsenegger
Egocentrische Narcist
pi_37863312
quote:
Op maandag 15 mei 2006 20:08 schreef the_disheaver het volgende:

[..]

1 ding: in opera 9 (beta 1) zit er geen ruimte tussen de submenu's. Wel geen border onderin
Beta browsers trek ik me nog maar even niets van aan

Ik ben een stuk verder, menu komt nu volledig uit database. de nesting wordt correct geparsed dus dat is het probleem niet.
Een en ander ziet er nu prima uit onder FF en Opera. Onder IE is echter de background transparant ( ) en en het menu valt steeds weg bij de onmouseover. Alleen als ik heeeeeeeeeeeeeel traag schuif gaat het goed.

url: http://webshop.xploise.nl/cart.php

relevante CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
#vertnav{
  list-style: none;
}

#vertnav{
     padding:0;
     margin:0;
}

#vertnav ul {
     padding: 0;
     margin:0;
     list-style: none;
     width:167px;
     z-index:99;
     position:absolute;
     overflow:visible;
}

#vertnav li {
     position: relative;
     cursor:pointer;
     cursor:hand;
     margin:0;
     width:171px;
     padding:0 2px;
     background-color:rgb(212,213,225);
     border-bottom:1px solid rgb(138, 139, 152);
     display:block;
     height:20px;
     line-height:20px;
}

#vertnav a {
     text-decoration:none;
     display:block;
     width:171px;
     height:20px;
}

#vertnav a:hover, #vertnav li:hover{
     background-color:rgb(179,181,196);
}
#vertnav ul li:hover, #vertnav ul li a:hover{
     background-color:rgb(179,181,196);
}

#vertnav ul, #vertnav ul ul, #vertnav ul ul ul{
     display:none;
     position:absolute;
     top:0;
     left:175px;
}

/* non-IE browsers see this */
#vertnav ul li>ul, #vertnav ul ul li>ul{
     margin-top:0;
}

#vertnav li:hover ul ul, #vertnav li:hover ul ul ul, #vertnav li:hover ul ul ul ul, #vertnav li:hover ul ul ul ul ul{
     display:none;
}

#vertnav li:hover ul, #vertnav ul li:hover ul, #vertnav ul ul li:hover ul, #vertnav ul ul ul li:hover ul, #vertnav ul ul ul ul li:hover ul{
     display:block;
}

li>ul {
     top: -1px;
     left: -5px;
}
/* Win IE only \*/
* html #vertnav li{float:left;}
/* end holly hack */ 


[ Bericht 1% gewijzigd door Swetsenegger op 15-05-2006 23:37:28 ]
  FOK!-Schrikkelbaas dinsdag 16 mei 2006 @ 08:37:51 #185
1972 Swetsenegger
Egocentrische Narcist
pi_37868812
Iemand een idee?
Ik krijg hetzelfde effect in Firefox wanneer ik de z-index weghaal in #vertnav ul

-edit-
Opgelost. Het menu schuift over een floating div, die ik nog een 'position: relative' had mee gegeven. Position uit die float gehaald en het werkt naar behoren

[ Bericht 55% gewijzigd door Swetsenegger op 16-05-2006 08:46:29 (Opgelost) ]
pi_37874576
quote:
Op dinsdag 16 mei 2006 08:37 schreef Swetsenegger het volgende:
Iemand een idee?
Ik krijg hetzelfde effect in Firefox wanneer ik de z-index weghaal in #vertnav ul

-edit-
Opgelost. Het menu schuift over een floating div, die ik nog een 'position: relative' had mee gegeven. Position uit die float gehaald en het werkt naar behoren
Voor wat het waard is, in IE 7 beta werkt het ook goed!
Ik was naar je probleem aan het kijken terwijl dat je die al had opgelost
pi_37909326
Waarom is de div #inhoud niet tot de onderkant? maar issie 100% van het browser venster + header?
Ik snap niet waarom die dat doet

-edit-
linkje zou handig zijn
www.danielpunt.nl/akxifo

[ Bericht 19% gewijzigd door super-muffin op 17-05-2006 11:17:34 ]
pi_37909833
als height 100% is, is hij de waarde van je hele website-toonbare deel van je browser. maar omdat je daarboven een header hebt, begint die div lager. terwijl hij wel de 100% hoogte heeft.

op mijn resolutie klopt je site helemaal niet verwacht ik, maar dat kan misschien door de nog-in-ontwikkeling-fase komen

er is geen manier om 100% - header te doen. tenzij je javascript zou gebruiken maar dat is weer omslachtig.


edit
in jouw geval zou ik de rode-witte-rode invulling een backgroundimage maken van 1px hoog, en die repeat-y doen in je body background, en je background-color dezelfde kleur maken als wat het nu is.

dan maak je je top-div daarbovenop met daarin je banner, zodat daar iig de background niet meer zichtbaar is. beetje spelen met afbeeldingmaat wanneer nodig.

waar je dan mee zit is de transparante afbeelding onderin je content-div. die zou je misschien in een eigen div kunnen zetten met een z-index lager dan je content-text. ofzo. het wordt een beetje spelen met float.

[ Bericht 37% gewijzigd door Desdinova op 17-05-2006 11:33:25 ]
As a rule, I never touch anything more sophisticated and delicate than myself.
  woensdag 17 mei 2006 @ 11:31:03 #189
62215 qu63
..de tijd drinkt..
pi_37910034
quote:
Op woensdag 17 mei 2006 11:10 schreef super-muffin het volgende:
Waarom is de div #inhoud niet tot de onderkant? maar issie 100% van het browser venster + header?
Ik snap niet waarom die dat doet

-edit-
linkje zou handig zijn
www.danielpunt.nl/akxifo
ik zou ook iig je alfabet-letters wat aanpassen in je lexicon. als ik nu op de E of de K ga staan blijven ze verspringen namelijk :'0

Als je er overheen gaat worden de letters groter, daardoor verspringt ie een regel naar beneden, dus staat mijn muis er niet meer op, en verspringt ie weer terug naar zn oorspronkelijke plekje, en begint het hele verhaal opnieuw
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
pi_37910161
quote:
Op woensdag 17 mei 2006 11:25 schreef Desdinova het volgende:
als height 100% is, is hij de waarde van je hele website-toonbare deel van je browser. maar omdat je daarboven een header hebt, begint die div lager. terwijl hij wel de 100% hoogte heeft.

op mijn resolutie klopt je site helemaal niet verwacht ik, maar dat kan misschien door de nog-in-ontwikkeling-fase komen

er is geen manier om 100% - header te doen. tenzij je javascript zou gebruiken maar dat is weer omslachtig.
hoe doe ik het met javascript? Ik ken zelf niet echt veel javascript, maar kan het wel gebruiken.
Tenzij iemand anders nog een oplossing heeft maar wat klopt er niet op jou resolutie? Ik zit hier op 1024x768 en daar is alles oké.

qu63: dat weet ik, daar moet ik nog wat aan doen ja.
  woensdag 17 mei 2006 @ 11:37:35 #191
33189 RM-rf
1/998001
pi_37910269
Om compleet te zijn... een percentuele hoogte betekent dat de hoogte bepaald wordt door het parent-element met 'layout' (wat betekent dat dat element een opgegeven breedte, hoogte of positionering moet kennen, eventueel gewoon hard 'position: relative;')..

In het geval van het element #content lijkt dat de viewbox te zijn, dat is het browservenster, eigenlijk te vertalen met het element HTML (in msie dacht ik de BODY tag, iig in quirky mode)

Volgens mij is dit probleem op te lossen door je element #head een position: relative; te geven:

1
2
3
#head {
   position: relative;
}
"Whatever you feel like: Life’s not one color, nor are you my only reader" - Ausonius, Epigrammata 25
pi_37910308
ik zit op een laptop met 1400xnogiets. maar op 1600x1200 zal hij het ook niet prima doen. hij is geen 100% bij mij, maar houdt ongeveer 200px eerder op. in internet explorer dan. heb hem niet bekeken met opera/netscape/firefox

ik zou het probleem niet oplossen met javascript. je zou dan een of andere functie moeten hebben die het toonbare deel van je browser checkt (is 100%), en aan de hand daarvan de div-height aanpast door je header-height eraf te trekken.
As a rule, I never touch anything more sophisticated and delicate than myself.
  woensdag 17 mei 2006 @ 11:46:44 #193
12880 CraZaay
prettig gestoord
pi_37910554
quote:
Op woensdag 17 mei 2006 11:37 schreef RM-rf het volgende:
viewbox
viewport
pi_37911848
quote:
Op woensdag 17 mei 2006 11:37 schreef RM-rf het volgende:
Om compleet te zijn... een percentuele hoogte betekent dat de hoogte bepaald wordt door het parent-element met 'layout' (wat betekent dat dat element een opgegeven breedte, hoogte of positionering moet kennen, eventueel gewoon hard 'position: relative;')..

In het geval van het element #content lijkt dat de viewbox te zijn, dat is het browservenster, eigenlijk te vertalen met het element HTML (in msie dacht ik de BODY tag, iig in quirky mode)

Volgens mij is dit probleem op te lossen door je element #head een position: relative; te geven:
[ code verwijderd ]
nee, position: relative doet niks.

Is er echt geen andere oplossing
Trouwens, nog iets geks, het achtergrondplaatje in #content doet het niet in FF
pi_37911883
quote:
Op woensdag 17 mei 2006 11:38 schreef Desdinova het volgende:
ik zit op een laptop met 1400xnogiets. maar op 1600x1200 zal hij het ook niet prima doen. hij is geen 100% bij mij, maar houdt ongeveer 200px eerder op. in internet explorer dan. heb hem niet bekeken met opera/netscape/firefox
Dat kwam om dat #box een height heeft van 600px; dat is nu al opgelost.
pi_37912105
dan heb je waarschijnlijk backslashes gebruikt (\) in plaats van forward (/) bij je link naar het plaatje
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_37912426
nee, hij staat gewoon in de root.

1background: url(bg-content.gif) fixed no-repeat bottom right #fff; 
pi_37912658
quote:
Op woensdag 17 mei 2006 12:43 schreef super-muffin het volgende:
nee, hij staat gewoon in de root.
[ code verwijderd ]
quottjes omheen?
pi_37912722
dan wordt je div waarschijnlijk niet geshowd (IE is wat flexibeler daarin). zet er maar even een border-width, border-style en border-color bij. effe tjekke wattie doet.
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_37914596
De DIV word wel geshowd, want het is die #content waar ik het hier boven over had
Als ik de property fixed weghaal doetie het wel.

-edit-


moet je kijken, als ik mn browserventer zo schaal komtie in eens te voorschijn
Wat is dit nu voor gekkigheid.

[ Bericht 41% gewijzigd door super-muffin op 17-05-2006 14:02:24 ]
pi_37915503
zet er nou een border omheen dan zie je wat je div uitspookt
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_37915729
Dan word alleen het witte vlakje omlijnt en gebeurt er niks met de achtergrond, die zie je nog steeds niet.
pi_37915917
okee. omdat je de shorthand versie gebruikt moet je waarschijnlijk alles defineren in de juiste volgorde:
background: <color><image><repeat><attachment><position>
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_37920039
dan nog steeds niet.

Maar ik wil eerst even dat andere probleem oplossen, dan kan ik verder.
De gene waar voor ik die website maak wil dat die tot de onderkant loopt. Het moet dus, hoe kan ik het oplossen met Javascript of moet ik heel de code anders in elkaar zetten?
pi_37920469
voor javascript kan je beter naar het javascript topic, kan ik je ook niet mee verder helpen helaas..
en anders als backgroundimage in je body. want dit is in mijn ervaring een regelrechte CSS hel. en ik heb er nooit degelijk antwoord op gekregen ook.

in iexplore zou je iig gewoon een height: 100%; op kunnen geven. en voor ff/ns/opera min-height: 100%;. maar zodra je content eroverheen loopt gaat het de zeik in bij ff/ns/opera.
As a rule, I never touch anything more sophisticated and delicate than myself.
  woensdag 17 mei 2006 @ 17:32:00 #206
12880 CraZaay
prettig gestoord
pi_37922192
quote:
Op woensdag 17 mei 2006 16:25 schreef super-muffin het volgende:
dan nog steeds niet.

Maar ik wil eerst even dat andere probleem oplossen, dan kan ik verder.
De gene waar voor ik die website maak wil dat die tot de onderkant loopt. Het moet dus, hoe kan ik het oplossen met Javascript of moet ik heel de code anders in elkaar zetten?
Als je puur visueel die kolommen tot onder door wilt laten lopen zou ik kiezen voor een oplossing als faux columns.
pi_37925950
quote:
Op woensdag 17 mei 2006 16:39 schreef Desdinova het volgende:
voor javascript kan je beter naar het javascript topic, kan ik je ook niet mee verder helpen helaas..
en anders als backgroundimage in je body. want dit is in mijn ervaring een regelrechte CSS hel. en ik heb er nooit degelijk antwoord op gekregen ook.

in iexplore zou je iig gewoon een height: 100%; op kunnen geven. en voor ff/ns/opera min-height: 100%;. maar zodra je content eroverheen loopt gaat het de zeik in bij ff/ns/opera.
Dat heb ik nu ook toegepast op mijn eigen website, maar dat is gewoon 1 lange div, daar staat geen header boven zoals in dit geval
  zaterdag 20 mei 2006 @ 01:52:44 #208
46275 Castor
Obey the rules, miss the fun
pi_38008378
quote:
Op woensdag 17 mei 2006 19:29 schreef super-muffin het volgende:

[..]

Dat heb ik nu ook toegepast op mijn eigen website, maar dat is gewoon 1 lange div, daar staat geen header boven zoals in dit geval
Dit zou moeten werken:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
#box {
width:750px;
height: 100%;
overflow:hidden;
background-color: #0099ff;
margin: 0px auto;
text-align:left;
background: url(header.jpg) top left no-repeat;}

#content {
width:400px;
height: 87%;
margin-bottom: 0;
float:left;
background: #fff url(bg-content.gif) no-repeat right bottom;}


#box op een height van 100% gezet met een overflow hidden. Vervolgens de #content een height geven van ongeveer 90%.
  zondag 21 mei 2006 @ 11:14:13 #209
12880 CraZaay
prettig gestoord
pi_38040555
quote:
Op zaterdag 20 mei 2006 01:52 schreef Castor het volgende:

[..]

Dit zou moeten werken:
[ code verwijderd ]

#box op een height van 100% gezet met een overflow hidden. Vervolgens de #content een height geven van ongeveer 90%.
Volkomen afhankelijk van de afmetingen van de viewport van de gebruiker, en daarom een ongeschikte oplossing imo.
  maandag 22 mei 2006 @ 01:18:36 #210
46275 Castor
Obey the rules, miss the fun
pi_38072414
quote:
Op zondag 21 mei 2006 11:14 schreef CraZaay het volgende:

[..]

Volkomen afhankelijk van de afmetingen van de viewport van de gebruiker, en daarom een ongeschikte oplossing imo.
Het is een simpele oplossing die met de meest gangbare resoluties prima werkt. Het enige is dat je bij een kleinere viewport niet de complete background image ziet. Niet echt onoverkomelijk imho.
  maandag 22 mei 2006 @ 09:11:22 #211
12880 CraZaay
prettig gestoord
pi_38074738
quote:
Op maandag 22 mei 2006 01:18 schreef Castor het volgende:

[..]

Het is een simpele oplossing die met de meest gangbare resoluties prima werkt. Het enige is dat je bij een kleinere viewport niet de complete background image ziet. Niet echt onoverkomelijk imho.
Dat is inderdaad een persoonlijke afweging die je moet maken. Persoonlijk vind ik het volkomen onacceptabel om geen volledige controle te hebben over het resultaat van de code, maar dat ben ik
pi_38086356
Waarom ziet dit er in Firefox zo Mooi en Strak uit, en laat IE de halve pagina niet zien?
pi_38086563
quote:
Op maandag 22 mei 2006 09:11 schreef CraZaay het volgende:

[..]

Dat is inderdaad een persoonlijke afweging die je moet maken. Persoonlijk vind ik het volkomen onacceptabel om geen volledige controle te hebben over het resultaat van de code, maar dat ben ik
Ik vind het ook geen goede oplossing, maar wel bedankt voor het mee mee denken
pi_38087690
@nevermind
geef je content-div eens een backgroundkleurtje? ik denk dattie zich verstopt
As a rule, I never touch anything more sophisticated and delicate than myself.
  maandag 22 mei 2006 @ 16:23:27 #215
32768 DionysuZ
Respect my authority!
pi_38088220
quote:
Op maandag 22 mei 2006 16:11 schreef Desdinova het volgende:
@nevermind
geef je content-div eens een backgroundkleurtje? ik denk dattie zich verstopt
ik denk dat er problemen zijn met de padding
1#content {float:left;position:absolute;padding:155px 10px 0 110px;}

hij zal in ieder geval naar de top left corner verschuiven door de position: absolute. En dan hopen dat de padding doet wat hij moet doen
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
pi_38088500
mja I know.. maar omdat er geen hoogte en breedte is opgegeven verwacht ik (nog) geen problmen met de padding. en gezien de hoeveelheid text die erin moet komen denk ik dat hij er nog wel onderuit had moeten komen..
As a rule, I never touch anything more sophisticated and delicate than myself.
  maandag 22 mei 2006 @ 16:54:08 #217
12880 CraZaay
prettig gestoord
pi_38089510
quote:
Op maandag 22 mei 2006 15:37 schreef Nevermind het volgende:
Waarom ziet dit er in Firefox zo Mooi en Strak uit, en laat IE de halve pagina niet zien?
Totaal los van je vraag toch een tip: bouw je html semantisch. Met andere woorden: gebruik minder div's en meer beschrijvende elementen. Je kop kan bijvoorbeeld prima uit de div en in een h1, en de div rond je ul is in principe ook onnodig.
pi_38092344
Pff, ik stap wel weer over op tabellen. Een hele middag kloten terwijl ik het in een minuut in elkaar heb met tabellen. En bedankt voor de tip CraZaay
  maandag 22 mei 2006 @ 18:47:07 #219
12880 CraZaay
prettig gestoord
pi_38093790
quote:
Op maandag 22 mei 2006 18:05 schreef Nevermind het volgende:
Pff, ik stap wel weer over op tabellen. Een hele middag kloten terwijl ik het in een minuut in elkaar heb met tabellen. En bedankt voor de tip CraZaay
Jammer Die tabellen heb je toch ook moeten leren te gebruiken? CSS leren kan soms frustrerend zijn, maar is om tig redenen beter dan tabellen (uit puristisch oogpunt gezien, maar zeker ook qua toegankelijkheid voor o.a. zoekmachines en visueel gehandicapten).
  maandag 22 mei 2006 @ 19:09:27 #220
32768 DionysuZ
Respect my authority!
pi_38094635
tabellen zijn niet bedoeld voor layout.
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
  maandag 22 mei 2006 @ 19:19:00 #221
12880 CraZaay
prettig gestoord
pi_38094964
quote:
Op maandag 22 mei 2006 19:09 schreef DionysuZ het volgende:
tabellen zijn niet bedoeld voor layout.
Niets is bedoeld voor lay-out En alles is bedoeld voor het aangeven van de structuur van de data Dat je al deze beschrijvende elementen kan stylen is natuurlijk heel mooi meegenomen (scheiding van structuur en weergave).

Dat je soms elementen toevoegt omdat het niet anders kan (div o.a.) is natuurlijk een feit (al kan een div ook een semantische betekenis hebben).
pi_38095313
quote:
Op maandag 22 mei 2006 18:47 schreef CraZaay het volgende:

[..]

Jammer Die tabellen heb je toch ook moeten leren te gebruiken? CSS leren kan soms frustrerend zijn, maar is om tig redenen beter dan tabellen (uit puristisch oogpunt gezien, maar zeker ook qua toegankelijkheid voor o.a. zoekmachines en visueel gehandicapten).
Ik weet het. Maar mijn doorzettingsvermogen heeft zijn grenzen. Vooral omdat ik, zoals je zag, bezig ben met een cms, en niet dagen bezig wil zijn om verschillende browsers compatibel te krijgen met een site (die waarschijnlijk alleen door mij en mijn huisgenoot gebruikt wordt ).

Want dat probleem heb ik op de eenofandere manier altijd. Altijd is er wel één van de drie (ik ben me er van bewust dat er meer browsers zijn) die het gewoon niet snapt. 80% mijn fout, omdat ik me nog steeds niet compleet kan redden in CSS, 20% de fout van de browsers. Ik loop mijn hoofd te breken over tientallen verschillende hacks die de fouten van een browser weer herstellen, maar ik word er brak van dát er fouten in browsers zitten. En ook al zijn tabellen niet voor layout bedoeld, ze doen tenminste precies wat ik wil. In vrijwel elke browser.

Tabellen zijn voor mij logisch. En volgens mij zijn ze dat voor iedereen. Je weet precies wat ze doen, en het werkt goed. CSS klinkt extreem logisch, maar in de praktijk kan ik er bijna nooit een volledige layout mee maken.
pi_38095470
Dat heb ik dus met tabellen, een complete layout maken met tabellen lukt me niet
  maandag 22 mei 2006 @ 19:53:27 #224
12880 CraZaay
prettig gestoord
pi_38096180
Het blijft een kwestie van ervaring. Ik maak tig sites en kan het me niet herinneren wanneer ik voor het laatst een CSS hack heb moeten gebruiken om iets voor elkaar te krijgen wat in iedere browser werkt (IE6+, dat wel). Doorrrrrgaan zou Barry Stevens zeggen
  dinsdag 23 mei 2006 @ 01:08:45 #225
46275 Castor
Obey the rules, miss the fun
pi_38109805
quote:
Op maandag 22 mei 2006 19:53 schreef CraZaay het volgende:
Het blijft een kwestie van ervaring. Ik maak tig sites en kan het me niet herinneren wanneer ik voor het laatst een CSS hack heb moeten gebruiken om iets voor elkaar te krijgen wat in iedere browser werkt (IE6+, dat wel). Doorrrrrgaan zou Barry Stevens zeggen
Dat is OF heel erg knap, OF je maakt erg simpele sites. De meeste gewone stervelingen moeten voor sommige complexe CSS toch wel een of meerdere "hacks" gebruiken.
  dinsdag 23 mei 2006 @ 09:03:19 #226
12880 CraZaay
prettig gestoord
pi_38112321
quote:
Op dinsdag 23 mei 2006 01:08 schreef Castor het volgende:

[..]

Dat is OF heel erg knap, OF je maakt erg simpele sites. De meeste gewone stervelingen moeten voor sommige complexe CSS toch wel een of meerdere "hacks" gebruiken.
Laten we het houden op een goed inzicht in structuren, want ik wil niet van mezelf zeggen dat ik knap ben, maar ook allerminst dat ik simpele sites html/css.
pi_38346513
Kan iemand me misschien uitleggen wat het verschil is tussen id="iets" en class="iets"? Er gebeurt namelijk het zelfde, maar er zal vast een duidelijk verschill tussen zijn
  maandag 29 mei 2006 @ 21:35:12 #228
32768 DionysuZ
Respect my authority!
pi_38346580
ik heb een vraagje waar ik maar niet uitkom. Ben bezig met een site die met 3 kolommen werkt. Nu moeten die drie kolommen van dezelfde lengte zijn. De middelste kolom is degene waarin een tekst van variabele lengte komt te staan en de anderen zijn menukolommen. Nu gebruikte ik altijd de faux columns manier om dit op te lossen (eerder in deze topic gelinkt), maar in dit specifieke geval is dit niet mogelijk. De achtergrond van de kolommen is nl. een image ipv gewoon een kleur. Weet iemand hoe ik dit kan oplossen?
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
  maandag 29 mei 2006 @ 21:46:00 #229
46794 Berkery
Fat bastard
pi_38347102
quote:
Op maandag 29 mei 2006 21:33 schreef Da_Koen het volgende:
Kan iemand me misschien uitleggen wat het verschil is tussen id="iets" en class="iets"? Er gebeurt namelijk het zelfde, maar er zal vast een duidelijk verschill tussen zijn
De namen zeggen het al een beetje, een id (identifier) moet uniek zijn en mag je op een pagina maar één keer gebruiken, een terwijl meerdere elementen tot een bepaalde class (klasse) kunnen behoren.

Zie ook http://www.handleidinghtml.nl/css/selectors/selectors04.html
Ich fälle Bäume und hupf und spring, steck Blumen in die Vas
Ich schlupf in Frauenleider, und lummel mich in Bars
pi_38347733
quote:
Op maandag 29 mei 2006 21:46 schreef Berkery het volgende:

[..]

De namen zeggen het al een beetje, een id (identifier) moet uniek zijn en mag je op een pagina maar één keer gebruiken, een terwijl meerdere elementen tot een bepaalde class (klasse) kunnen behoren.

Zie ook http://www.handleidinghtml.nl/css/selectors/selectors04.html
thx voor de link
pi_38347849
quote:
Op maandag 29 mei 2006 21:35 schreef DionysuZ het volgende:
ik heb een vraagje waar ik maar niet uitkom. Ben bezig met een site die met 3 kolommen werkt. Nu moeten die drie kolommen van dezelfde lengte zijn. De middelste kolom is degene waarin een tekst van variabele lengte komt te staan en de anderen zijn menukolommen. Nu gebruikte ik altijd de faux columns manier om dit op te lossen (eerder in deze topic gelinkt), maar in dit specifieke geval is dit niet mogelijk. De achtergrond van de kolommen is nl. een image ipv gewoon een kleur. Weet iemand hoe ik dit kan oplossen?
ik heb het opgelost door:

1
2
3
4
5
body {

   background: #ffffff url(./images/shadow.gif) repeat-y 506px 120px;

}  

Met de laatste 2 getallen de plaats waar de afbeelding als eerste moet beginnen (hier 506 pixels vanaf de linkerkant, en 120 vanaf de bovenkant)
  maandag 29 mei 2006 @ 22:21:27 #232
32768 DionysuZ
Respect my authority!
pi_38349057
nee daar heb ik helaas niets aan omdat de body al een achtergrond heeft. kijk op http://mankind2.clickthis.nl voor een voorbeeld. In IE ziet het er goed uit, firefox helaas niet.
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
pi_38349697
quote:
Op maandag 29 mei 2006 22:21 schreef DionysuZ het volgende:
nee daar heb ik helaas niets aan omdat de body al een achtergrond heeft. kijk op http://mankind2.clickthis.nl voor een voorbeeld. In IE ziet het er goed uit, firefox helaas niet.
link doet het niet
pi_38351845
Weer een vraagje

Is het mogelijk om een span een bepaalde lengte te geven? Het volgende werkt namelijk niet:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<html>

<head>
   <title>OBN toevoegen</title>
   <style type="text/css">
   p
   {
      width: 300px;
   }
   span
   {
      width: 100px;
   }
   </style>
<head>
<body>

<p>
<span>dsssss</span> sss ssss sssssss ssssss ssssss ssssss sssssss ss sssssss sfsdf sdfsdfsd fsdf sdfsdf sdfsdf 
</p>
<p>
<span>dsssss</span> dssss svsss ssssv vsss ssss ssvv sssss ssss s ssssss sssss ss ssss ssssss fsdf sdf sdfsd  fsdf sdfs df sdfsdf 
</p>
</body>
</html>


[ Bericht 37% gewijzigd door Da_Koen op 30-05-2006 10:14:52 ]
  dinsdag 30 mei 2006 @ 00:49:34 #235
46275 Castor
Obey the rules, miss the fun
pi_38355490
quote:
Op maandag 29 mei 2006 23:09 schreef Da_Koen het volgende:
Weer een vraagje

Is het mogelijk om een span een bepaalde lengte te geven? Het volgende werkt namelijk niet:
1Code verwijderd.
Een span is "display: inline" maak er "display:block" van en dan kun je er een width aan geven.
pi_38411826
Ik heb een probleem met het over elkaar plaatsen van 2 div'jes.
Het 1e divje krijgt een achtergrond plaatje, het 2e divje komt over de 1e div heen en heeft ook een achtergrond plaatje.

In firefox ziet het er goed uit, in IE verschuift de 2e div.

Wie kan me helpen?

CSS-code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
div#box2a{
width: 157px;
height: 120px;
/*border:1px dotted;*/
margin-top:13px;
margin-left:1px;
background: #D3E6CF url(schaduw.jpg) no-repeat 0 0;
}

div#box2a2{
width: 150px;
height: 113px;
/*border:1px dotted;*/
margin-top:10px;
margin-left:7px;
background: #D3E6CF url(test.jpg) no-repeat 0 0;
}


HTML-code:
1<div id="box2a"><div id="box2a2"></div></div>


URL naar het geheel
pi_38412100
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
div#box2a{
width: 157px;
height: 120px;
/*border:1px dotted;*/
margin-top:13px;
background: #D3E6CF url(schaduw.jpg) no-repeat 0 0;
}

div#box2a2{
width: 150px;
height: 113px;
/*border:1px dotted;*/
margin-left:7px;
background: #D3E6CF url(test.jpg) no-repeat 0 0;
}


lost het op

waarom is de de border een comment overigens?

[ Bericht 4% gewijzigd door super-muffin op 31-05-2006 15:46:21 ]
pi_38413085
quote:
Op woensdag 31 mei 2006 15:39 schreef super-muffin het volgende:

[ code verwijderd ]

lost het op

waarom is de de border een comment overigens?


De border is een comment omdat ik hem even heb gebruikt om te testen
Zodra het testen klaar is gooi ik hem uit de code.
pi_38413521
oke,doe ik ook, maar dan geef ik de border kleur mee te geven dan voor het testen, kun je makkelijk onderscheid maken
pi_38479721
Als ik in quirksmode werk dan krijg ik geen verticale scrollbalk, anders wel.
Hoe kom ik van mijn verticale scrollbalk af (op een nette manier).

Begin CSS code
1
2
3
4
5
6
html, body {
   height: 100%;
   margin-top: 0px;
   margin-right: 0px;
   margin-bottom: 0px;
   margin-left: 0px;


Tabel
1<table cellpadding='0' cellspacing='0' width='100%' bgcolor='#ffe4b5' style='height: 100%;'>
  dinsdag 6 juni 2006 @ 17:56:52 #241
12880 CraZaay
prettig gestoord
pi_38597518
quote:
Op vrijdag 2 juni 2006 16:51 schreef mrbombastic het volgende:
Als ik in quirksmode werk dan krijg ik geen verticale scrollbalk, anders wel.
Hoe kom ik van mijn verticale scrollbalk af (op een nette manier).
Probeer eens 'overflow: auto' op je body
pi_38627600
ik heb 2 div's langs elkaar staan, ze hebben allebei een min-height:400px.
De rechtse div wordt afhankelijk van de hoeveelheid tekst af en toe opgerekt.
De linkse div wil ik dan ook mee opgerekt krijgen, iemand een idee hoe ik dat voor elkaar krijg?
  donderdag 8 juni 2006 @ 00:49:18 #243
145090 HenkBenzinetank
Toegevoegde waarde
pi_38643489
zoek even op faux-columns
pi_38644119
quote:
Op vrijdag 2 juni 2006 16:51 schreef mrbombastic het volgende:
Als ik in quirksmode werk dan krijg ik geen verticale scrollbalk, anders wel.
Hoe kom ik van mijn verticale scrollbalk af (op een nette manier).

Begin CSS code
[ code verwijderd ]

Tabel
[ code verwijderd ]
Ten eerste, je kunt die margin in 2 property gooien.
Als je verschillende margins wilt gebruiken doe je het zo
1margin: *boven* *rechts* *onder* *links*;


Ik zou geen tabel gebruiken, maar een DIV.

CSS
1
2
3
4
5
6
7
8
9
html, body {
height: 100%;
margin: 0;
}
#naam {
width: 100%;
height: 100%;
background-color: #ffe4b5;
}


HTML
1
2
3
<div id="naam">
inhoud van deze DIV
</div>
pi_38817651
Hoe krijg ik de invulvakken van de volgende code netjes onder elkaar zonder gebruik te maken van tabellen? Ik wil het realiseren m.b.v. css. Wat is de meest snelle/logische manier? Nu worden ze direct achter de tekt uitgelijnt.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<form action="http://......" method="post" name="test1" id="test1">
      Naam: 
      <input name="naam" type="text" id="naam" size="35"> 
      <br>
      Achternaam:
      <input name="achternaam" type="text" id="achternaam" size="35"> 
      <br>
      Man
      <input type="radio" name="radiobutton" value="man" checked> 
      Vrouw
      <input type="radio" name="radiobutton" value="vrouw"> 
      <br>
      straat:
      <input name="straat" type="text" id="straat"> 
      <input name="nr" type="text" id="nr" size="6" maxlength="6"> 
      <br>
      postcode:
      <input name="postcode" type="text" id="postcode" size="6" maxlength="6"> 
      <br>
      plaats:
      <input name="plaats" type="text" id="plaats" size="35"> 
      <br>
      Email:
      <input name="mail" type="text" id="mail" onBlur="MM_validateForm

('naam','','R','mail','','RisEmail');return document.MM_returnValue" value="" size="35"> 
      <br>
      Bericht: 
      <textarea name="Bericht" cols="27" id="Bericht"></textarea>
      <br> 
      
        <input type="submit" name="Submit" value="send"> 
        <input type="reset" name="Reset" value="reset"> 
        <input name="MailToAddress" type="hidden" value="...@hotmail.com">
    </form> 



Ik ben op de hoogte van de spamgevoeligheid van het form.

[ Bericht 2% gewijzigd door Hunchy op 13-06-2006 17:30:54 ]
  dinsdag 13 juni 2006 @ 17:48:49 #246
12880 CraZaay
prettig gestoord
pi_38819041
quote:
Op dinsdag 13 juni 2006 17:06 schreef Hunchy het volgende:
Hoe krijg ik de invulvakken van de volgende code netjes onder elkaar zonder gebruik te maken van tabellen? Ik wil het realiseren m.b.v. css. Wat is de meest snelle/logische manier? Nu worden ze direct achter de tekt uitgelijnt.
Labels gebruiken en deze met CSS een bepaalde breedte geven.

Voorbeeld: http://www.pixy.cz/blogg/clanky/css-fieldsetandlabels.html
  vrijdag 16 juni 2006 @ 17:35:10 #247
20849 Fred
Beroepschagrijn
pi_38925085
Ik ben bezig met een nieuw gastenboek voor mn site. Technisch gezien ben ik op een paar kleine dingen tevreden, maar de lay-out is nog niet helemaal optimaal.
Iedere entry heeft een blauwe balk. daar staat in wie het bericht heeft gepost en wanneer. Ook is er de mogelijkeid om een website te vermelden. Het probleem is dat ik nu linkjes standaard "bold #0000FF" zijn. je ziet de linkjes dus niet.
Hoe krijg ik met CSS voor elkaar dat alleen de linkjes in de blauwe balken "bold #FFFFEE" worden?
So we just called him Fred
pi_38925793
Haal eerst eens al die <font> <center> bgcolor="" en border="" zooi weg anders wordt het nooit wat.
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
  vrijdag 16 juni 2006 @ 18:27:50 #249
12880 CraZaay
prettig gestoord
pi_38926006
quote:
Op vrijdag 16 juni 2006 17:35 schreef FredvZ het volgende:
Hoe krijg ik met CSS voor elkaar dat alleen de linkjes in de blauwe balken "bold #FFFFEE" worden?
Aan die blauwe balken een class hangen (dus aan de td of div of wat je ook gebruikt), en dan in de css:

1
2
3
4
.classnaam a {
    color: #FFFFEE;
    font-weight: bold;
}

Dus géén class aan de links zelf hangen, want dat moet je dat voor iedere link doen en da's dus nogal wat redundante code
  vrijdag 16 juni 2006 @ 23:38:42 #250
20849 Fred
Beroepschagrijn
pi_38934004
quote:
Op vrijdag 16 juni 2006 18:17 schreef SuperRembo het volgende:
Haal eerst eens al die <font> <center> bgcolor="" en border="" zooi weg anders wordt het nooit wat.
hmja, dat snap ik, maar zo ging het vroeger met html...
quote:
Op vrijdag 16 juni 2006 18:27 schreef CraZaay het volgende:
Aan die blauwe balken een class hangen (dus aan de td of div of wat je ook gebruikt), en dan in de css:
[ code verwijderd ]

Dus géén class aan de links zelf hangen, want dat moet je dat voor iedere link doen en da's dus nogal wat redundante code
thnx
So we just called him Fred
pi_39090187
Ik weer. Er loopt nog steeds iets fout en ik zie niet waar het mis gaat.

Http://www.jarnonieuwenhuize.nl

Als ik een <h5> bijvoorbeeld ergens om plaats wordt er direct een witregel boven en onder geplaats, irritant, maar ala. Wat ik echter niet snap is dat in het menu de eerste link "homepage" een h5 tag heeft, wél de meeste opmaakzaken meeneemt, maar níet de tekstkleur die ik wil. Wat is de oorzaak?
pi_39091042
quote:
Op woensdag 21 juni 2006 20:53 schreef Autoreply het volgende:
Als ik een <h5> bijvoorbeeld ergens om plaats wordt er direct een witregel boven en onder geplaats, irritant, maar ala.
Dat is de margin die standaard op een header zit.
quote:
Wat ik echter niet snap is dat in het menu de eerste link "homepage" een h5 tag heeft, wél de meeste opmaakzaken meeneemt, maar níet de tekstkleur die ik wil. Wat is de oorzaak?
Hij gebruikt de kleur van de link. De kleur van de link gaat voor de kleur van de header omdat de selctor van de link (a:link) meer specifiek is dan die van de header (h5). Dat kan je bijvoorbeeld oplossen met
1h5 a { color: #555; }
Wil iedereen die in telekinese gelooft nu mijn hand op steken?
| Foto's van toen en nu | Icons | Whatpulse keyboard | .NET developer? |
  donderdag 22 juni 2006 @ 00:02:41 #253
12880 CraZaay
prettig gestoord
pi_39097596
quote:
Op woensdag 21 juni 2006 20:53 schreef Autoreply het volgende:
Als ik een <h5> bijvoorbeeld ergens om plaats wordt er direct een witregel boven en onder geplaats, irritant, maar ala.
Als je geen marges wilt doe je
1
2
3
h5 {
  margin: 0;
}
pi_39105253
Dummy meldt zich . Ik wil een site maken aan de hand van CSS aangezien mij is verteld dat gewone tabellen echt niet meer kunnen en de mogelijkheden van CSS mij wel aanspreken.

Nu weet ik echt niet waar ik moet beginnen. Al wat sites doorgenomen (http://www.w3schools.com/) etc., maar ik word niet veel wijzer. Is er een site die het gebruik van CSS beschrijft vanaf stap 1? Ik weet wel wat, maar helaas net niet genoeg op de uitleg op w3school te begrijpen.

Heb ook gekeken voor wat boeken over css. Iemand een tip?
  donderdag 22 juni 2006 @ 17:25:15 #255
145090 HenkBenzinetank
Toegevoegde waarde
pi_39117992
Vergeet niet dat CSS niet de sleutel tot een geslaagd design is.
Het is slechts een manier om het gedrag/opmaak van je html-elementen te veranderen.
Een goed design staat of valt nog steeds met de opbouw van je html-code.
  vrijdag 23 juni 2006 @ 13:31:34 #256
46794 Berkery
Fat bastard
pi_39146943
quote:
Op donderdag 22 juni 2006 11:16 schreef Foxxy het volgende:

Dummy meldt zich . Ik wil een site maken aan de hand van CSS aangezien mij is verteld dat gewone tabellen echt niet meer kunnen en de mogelijkheden van CSS mij wel aanspreken.
Heb je deze al eens bekeken?
Ich fälle Bäume und hupf und spring, steck Blumen in die Vas
Ich schlupf in Frauenleider, und lummel mich in Bars
pi_39154722
Ik ben bezig met het maken van een css file om te printen. Nu zou ik graag i.p.v. de textvakken in mijn contactformulier puntjes willen printen. Hoe krijg ik dit het makkelijkst voor elkaar? Ik heb het nu geprobeerd door de puntjes op de site 'hidden' weer te geven en bij de print gewoon zichtbaar. Helaas komen de puntjes niet op de plaats van de textvakken te staan. Iemand een idee?
  vrijdag 23 juni 2006 @ 17:27:11 #258
62215 qu63
..de tijd drinkt..
pi_39154966
quote:
Op vrijdag 23 juni 2006 17:19 schreef Hunchy het volgende:
Ik ben bezig met het maken van een css file om te printen. Nu zou ik graag i.p.v. de textvakken in mijn contactformulier puntjes willen printen. Hoe krijg ik dit het makkelijkst voor elkaar? Ik heb het nu geprobeerd door de puntjes op de site 'hidden' weer te geven en bij de print gewoon zichtbaar. Helaas komen de puntjes niet op de plaats van de textvakken te staan. Iemand een idee?
standaard value op "........." zetten, en dan de textvakken een border van "0" geven etc.
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
pi_39155932
quote:
Op vrijdag 23 juni 2006 17:27 schreef qu63 het volgende:

[..]

standaard value op "........." zetten, en dan de textvakken een border van "0" geven etc.
Bedoel je dat ik het formulier gewoon twee keer moet maken 1 zichtbaar en 1 onzichtbaar? En dan andersom zichtbaar bij de print versie? Of kun je de standaard waarde zichtbaar en onzichtbaar maken? Het is de bedoeling dat ik op het scherm gewoon de standaard vakken krijg. Dus alleen puntjes bij de printversie.

Het is voor een school opdracht met de volgende criteria:
Speciale printvriendelijke CSS voor het invulformulier:
- puntjes i.p.v. invulvelden
- adresgegevens i.p.v. verzendbutton
pi_39156268
quote:
Op donderdag 22 juni 2006 17:25 schreef HenkBenzinetank het volgende:
Vergeet niet dat CSS niet de sleutel tot een geslaagd design is.
Het is slechts een manier om het gedrag/opmaak van je html-elementen te veranderen.
Een goed design staat of valt nog steeds met de opbouw van je html-code.
Weet ik!
quote:
Op vrijdag 23 juni 2006 13:31 schreef Berkery het volgende:

[..]

Heb je deze al eens bekeken?
Kijk, hier kan ik wat mee! Dank je.

[ Bericht 27% gewijzigd door Foxxy op 23-06-2006 18:35:19 ]
  vrijdag 23 juni 2006 @ 22:25:26 #261
46794 Berkery
Fat bastard
pi_39163290
quote:
Op vrijdag 23 juni 2006 17:19 schreef Hunchy het volgende:
Ik ben bezig met het maken van een css file om te printen. Nu zou ik graag i.p.v. de textvakken in mijn contactformulier puntjes willen printen. Hoe krijg ik dit het makkelijkst voor elkaar? Ik heb het nu geprobeerd door de puntjes op de site 'hidden' weer te geven en bij de print gewoon zichtbaar. Helaas komen de puntjes niet op de plaats van de textvakken te staan. Iemand een idee?
In je print-sheet de border van het invoerveld op 0 zetten, en de border-bottom op 1px dotted black

Voorbeeld
Ich fälle Bäume und hupf und spring, steck Blumen in die Vas
Ich schlupf in Frauenleider, und lummel mich in Bars
pi_39188912
Berkery bedankt!! Ik dacht wel dat er een eenvoudige oplossing voor zou zijn Dank!!
pi_39261345
Ik heb een probleem met een div (die de footer voorstelt) helemaal onderaan de pagina.

Hoe krijg ik die div standaard onder in beeld? Indien er een scrollbalk ontstaat moet de footer onderaan de tekst getoond worden (dus niet fixed).
Het is dus eigenlijk de bedoeling dat de div onderaan de pagina komt indien de pagina niet tekstvullend is.

Hoe is dit mogelijk?
pi_39261639
Er was wel een hele omslachtige methode, die ga ik even voor je zoeken


-edit:

Deze?
http://scott.sauyet.name/CSS/Demo/FooterDemo1.html
pi_39262585
Ook eentje die wel in opera (9) werkt?
pi_39285236
weet iemand toevallig hoe ik een div zo positioneer dat hij altijd in het midden van je scherm staat? en dat het niet uitmaakt waar je naartoe scrollt?

dus in principe een layer die altijd op zijn plaats blijft met hierin een gecentreerde div, en daarachter de website.

het klinkt heel ongebruiksvriendelijk, maar dat is t niet
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_39285707
position: fixed

Maar dat werkt niet in IE.
http://www.cssplay.co.uk/layouts/fixed.html
Dit wel

en om die box in het midden te krijgen:
#midden_div {
position: absolute;
height: 200px;
width: 400px;
margin: -100px 0px 0px -200px;
top: 50%;
left: 50%;
padding: 0px; }

[ Bericht 19% gewijzigd door super-muffin op 27-06-2006 15:14:20 ]
pi_39287137
thanks!
As a rule, I never touch anything more sophisticated and delicate than myself.
  donderdag 29 juni 2006 @ 01:30:49 #270
12880 CraZaay
prettig gestoord
pi_39342392
quote:
Op dinsdag 27 juni 2006 15:09 schreef super-muffin het volgende:

(...)
Besef wel dat je met het op deze manier centreren een deel van de div onzichtbaar wordt wanneer de viewport kleiner is dan de div. Horizontaal centreren daarom met 'margin: 0 auto' (en verticaal centreren kan niet fatsoenlijk met alleen CSS ).
  donderdag 29 juni 2006 @ 04:48:08 #271
32768 DionysuZ
Respect my authority!
pi_39344502
quote:
Op donderdag 29 juni 2006 01:30 schreef CraZaay het volgende:

[..]

Besef wel dat je met het op deze manier centreren een deel van de div onzichtbaar wordt wanneer de viewport kleiner is dan de div. Horizontaal centreren daarom met 'margin: 0 auto' (en verticaal centreren kan niet fatsoenlijk met alleen CSS ).
verticaal centreren kan WEL fatsoenlijk met alleen CSS. Heb dit al verschillende malen bij sites geprobeerd. De voorgestelde oplossing is gedeeltelijk de oplossing, ware het niet dat de site deels wegvalt bij een kleinere viewport, maar daar heb je weer andere css constructies voor.
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
  donderdag 29 juni 2006 @ 09:27:57 #272
12880 CraZaay
prettig gestoord
pi_39346340
quote:
Op donderdag 29 juni 2006 04:48 schreef DionysuZ het volgende:

[..]

verticaal centreren kan WEL fatsoenlijk met alleen CSS. Heb dit al verschillende malen bij sites geprobeerd. De voorgestelde oplossing is gedeeltelijk de oplossing, ware het niet dat de site deels wegvalt bij een kleinere viewport, maar daar heb je weer andere css constructies voor.
Erm, is dit niet precies wat ik zeg? Een deel valt weg, en het is daarom geen fatsoenlijke oplossing.
Maar ik ben erg geinteresseerd om te zien op welke cleane manier je het voor elkaar hebt gekregen, nooit te oud om te leren
pi_39346843
Ik wist daar van ja, en ik ben ook benieuwd naar de oplossing
  donderdag 29 juni 2006 @ 17:48:14 #274
32768 DionysuZ
Respect my authority!
pi_39362034
een min-height instellen. Alleen dit werkt (nog) niet goed in IE, dus moet je daar een hack voor gebruiken.
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
  donderdag 29 juni 2006 @ 17:48:30 #275
32768 DionysuZ
Respect my authority!
pi_39362040
voorbeeldje heb ik op http://www.jehannedarc.fr
□ Reality is merely an illusion,albeit a very persistent one-A.Einstein
■ Of ik ben gek of de rest van de wereld.Ik denk zelf de rest van de wereld-Rudeonline
□ The war is not meant to be won.It is meant to be continuous-G.Orwell
pi_39394548
Volgende code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<div id="hmenu">
            <dl id="menu">
      <dt onmouseover="javascript:schuif('smenu0');" onmouseout="javascript:schuif();"><a href="/nieuw1/">Home</a></dt>
      <dt onmouseover="javascript:schuif('smenu1');" onmouseout="javascript:schuif();"><a href="#">Groep</a></dt>
         <dd id="smenu1" onmouseover="javascript:schuif('smenu1');" onmouseout="javascript:schuif();">
            <ul>
               <li><a href="#">Tekst</a></li>

            </ul>
         </dd>
      <dt onmouseover="javascript:schuif('smenu4');" onmouseout="javascript:schuif();"><a href="#">Groep</a></dt>
         <dd id="smenu4" onmouseover="javascript:schuif('smenu4');" onmouseout="javascript:schuif();">
            <ul>
               <li><a href="#">Tekst</a></li>
            </ul>
         </dd>
      <dt onmouseover="javascript:schuif('smenu5');" onmouseout="javascript:schuif();"><a href="#">Groep</a></dt>
         <dd id="smenu5" onmouseover="javascript:schuif('smenu5');" onmouseout="javascript:schuif();">
            <ul>
               <li><a href="#">Nog</a></li>
               <li><a href="#">Invullen</a></li>
            </ul>
         </dd>
      <dt onmouseover="javascript:schuif('smenu6');" onmouseout="javascript:schuif();"><a href="/nieuw1/pages/contact.html">Contact</a></dt>
</dl></div>
         <div id="inhoud">
            <h4>Tekst....................</h4>
            <div id="fotofront">
            <a href="javascript:SLIDES.hotlink()"><img name="SLIDESIMG" src="../images/IM000189.JPG" border="0" style="filter:progid:DXImageTransform.Microsoft.Fade()" alt="Slideshow image"></a>
            </div>
</div>

Met de volgende css code:
1
2
3
4
5
6
7
8
9
10
#hmenu        { color: #fefdd3; background-color: #f9ee00; display: block; padding: 0; width: 160px; height: auto; float: left; clear: both; border-right: 1px solid #eb4b2b; \width: 140px; w\idth: 120px       }
#inhoud                    { color: #404040; background-color: #fefdd3; text-align: left; display: block; margin: 0 0 0 160px; padding: 10px 0 0 20px; z-index: 1; width: 760px }
#fotofront                      { color: #404040; background-color: #fefdd3; text-align: center; display: block; margin: auto; padding: 10px 0; z-index: 2; width: 740px; height: 500px; vertical-align: middle }
#menu dt        { color: #eb4b2b; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; line-height: 27px; background: #f9ee00; text-align: center; cursor: pointer; margin: 0; padding: 0; z-index: 101; height: 27px; border-style: solid; border-width: 0 1px 1px 8px; border-color: #eb4b2b }
#menu dt a:hover         { color: #f9ee00; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; line-height: 27px; background: #eb4b2b; text-align: center; cursor: pointer; margin: 0; padding: 0; z-index: 101; height: 27px }
#menu dd        { color: #EB4B2B; font-family: Verdana, Arial, Helvetica, sans-serif; background: #F9EE00; margin-top: -1.5em; position: absolute; z-index: 100; right: 8em; left: 140px; width: 9.5em; border-style: solid; border-width: 0 1px 1px; border-color: #EB4B2B }
#menu ul    { margin: 0; padding: 0; z-index: 102 }
#menu li       { color: #eb4b2b; font-size: 100%; font-family: Verdana, Arial, Helvetica, sans-serif; line-height: 18px; background: #f9ee00; text-align: center; margin: 0; padding: 0; z-index: 103; height: 18px; border-style: solid; border-width: 1px 0 0; border-color: #eb4b2b }
#menu li a, #menu dt a    { color: #404040; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none; display: block; z-index: 103; height: 18px; overflow: visible }
#menu li a:hover      { color: #f9ee00; font-family: Verdana, Arial, Helvetica, sans-serif; background: #eb4b2b; z-index: 103; height: 18px; overflow: visible }
Nu is het zo dat het schuifmenu geheel uitstaat als je de pagina oproept. Als je dan met de muis over het menu heengaat schuift het weer in en daarna gedraagt het zich zoals zou moeten. Maar in eerste instantie staat het menu dus uit en dat krijg ik niet weg. Iemand een idee. Ik heb al zitten klooien met Z-index etc. Maar dat helpt niet.
Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.
pi_39395526
Heb je een online voorbeeld, want wij kunnen jou javascript niet zien zo
pi_39395868
quote:
Op vrijdag 30 juni 2006 16:35 schreef super-muffin het volgende:
Heb je een online voorbeeld, want wij kunnen jou javascript niet zien zo
http://www.bbfmetaal.nl/nieuw1/
Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.
pi_39396055
Oke, ik ga zo even naar kijken.
Maar ik moet zeggen dat ik geen expert ben op JS gebied.

Waarom heb je hier trouwens een defenition list voor gebruikt een geen UL?
pi_39396422
quote:
Op vrijdag 30 juni 2006 16:50 schreef super-muffin het volgende:
Oke, ik ga zo even naar kijken.
Maar ik moet zeggen dat ik geen expert ben op JS gebied.

Waarom heb je hier trouwens een defenition list voor gebruikt een geen UL?
Noob en aan het leren. Ik zal daar eens naar kijken. Dank je.
Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.
pi_39417426
Ik zou als ik jou was eens kijken op alistapart.com of cssplay.co.uk naar een menu
pi_39418667
quote:
Op zaterdag 1 juli 2006 10:09 schreef super-muffin het volgende:
Ik zou als ik jou was eens kijken op alistapart.com of cssplay.co.uk naar een menu
Ik heb het boek van Zeldman liggen. Moet ik nog aan beginnen. Nu eerst het strand op.
Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.
pi_39682317
ik heb het volgende 'probleem'
ik heb de volgende code:
1
2
<a href="#" id="gl1" class="glink" onmouseover="ehandler(event,menuitem1);">link1</a>
<a href="#" id="gl2" class="glink" onmouseover="ehandler(event,menuitem2);">link2</a>


samen met de volgende CSS code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
a.glink, a.glink:visited{
     font-size: small;
     color: #000000;
   font-weight: bold;
   margin: 0px;
   padding: 2px 5px 4px 5px;
   border-right: 1px solid #8FB8BC;
   cursor:pointer;
}

a.glink:hover{
     background-image: url(images/glblnav_selected.gif);
   text-decoration: none;
}

hoe kan ik dit zo aan passen dat de style behouden blijft maar dat het geen hyperlinks meer zijn..?
een voorbeeldje is hier te zien:
http://fia181-83.dsl.hccnet.nl/anime_argeweb/1.php
  maandag 10 juli 2006 @ 09:18:06 #284
62215 qu63
..de tijd drinkt..
pi_39682396
quote:
Op maandag 10 juli 2006 09:12 schreef mschol het volgende:
ik heb het volgende 'probleem'
ik heb de volgende code:

[ code verwijderd ]

samen met de volgende CSS code

[ code verwijderd ]
hoe kan ik dit zo aan passen dat de style behouden blijft maar dat het geen hyperlinks meer zijn..?
een voorbeeldje is hier te zien:
http://fia181-83.dsl.hccnet.nl/anime_argeweb/1.php
door a.glink:visited ook toe te voegen geloof ik, dan gaat ie wel naar 1.php#, maar verder niet. je zou ook <span> of <div> kinnen gebruiken als je de href toch niet gebruikt
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
pi_39682414
Bedoel je als je op die link klikt, het geen link meer is?
Met CSS is het niet mogelijk. Want CSS is alleen voor de opmaak.

wel kun je een PHP gebruiken:
http://www.alistapart.com/articles/keepingcurrent/
pi_39682625
quote:
Op maandag 10 juli 2006 09:18 schreef qu63 het volgende:

[..]

door a.glink:visited ook toe te voegen geloof ik, dan gaat ie wel naar 1.php#, maar verder niet. je zou ook <span> of <div> kinnen gebruiken als je de href toch niet gebruikt
ahh <span> is idd de oplossing
alleen werkt het Hover effect dan niet meer
hoe zou ik dat kunnen fixen?
  maandag 10 juli 2006 @ 09:37:19 #287
62215 qu63
..de tijd drinkt..
pi_39682695
quote:
Op maandag 10 juli 2006 09:32 schreef mschol het volgende:

[..]

ahh <span> is idd de oplossing
alleen werkt het Hover effect dan niet meer
hoe zou ik dat kunnen fixen?
span.glink:Hover zou moeten werken hoor
It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]
pi_39682851
quote:
Op maandag 10 juli 2006 09:37 schreef qu63 het volgende:

[..]

span.glink:Hover zou moeten werken hoor
hmmm om de een of andere reden pakt IE die dus niet..
moet maar eff gaan kijken of er een workaround voor is

--edit--

net wat zitten testen met een linkje (waar ik ook dat hover effect op wil hebben:
als ik:
border-right: 1px solid #8FB8BC;
bij een a.glink.hover weghaal dan werkt me hover niet meer (en alleen in IE)
zet ik em terug doetie ut weer..

[ Bericht 23% gewijzigd door mschol op 10-07-2006 10:10:25 ]
pi_39683474
IE kan alleen hoveren op A

Er is wel een fix voor.
http://www.xs4all.nl/~peterned/csshover.html
pi_39684573
quote:
Op maandag 10 juli 2006 10:23 schreef super-muffin het volgende:
IE kan alleen hoveren op A

Er is wel een fix voor.
http://www.xs4all.nl/~peterned/csshover.html

Mijn dank is groot
pi_39861217


1
2
3
4
5
6
7
8
9
<div class="navpanel">
   <div class="header">Navigatie</div>
   <div class="navpanel_deco"> </div>
   <div class="navpanel_items">
      <a href="http://site.nl/fp/1">Voorpagina</a>
      <a href="http://site.nl/fp/2">Blaat</a>
      <a href="http://site.nl/fp/3">Nog wat</a>
   </div>
</div>


Ik wil dat .navpanel_deco net zo lang wordt als .navpanel_items. Eerstgenoemde heeft geen inhoud. Hoe zorg ik er daarvoor zonder javascript of tabellen? De hoogte is niet van te voren bekend. Ik pak het waarschijnlijk sowieso op een verkeerde manier aan, dus graag wat advies

Dit is de style:
1
2
3
4
5
.navpanel_deco      {   background: #e4eff7;
                        width: 20px;
                        border-right: 1px solid #b5c0c8;
                        margin-right: 5px;
                        float: left; } 


Vereiste is overigens dat de navigatie-items als A-tag worden neergezet, zodat IE6 de :hover-tag ondersteunt.
pi_39868187
zonder javascript is dat denk ik onmogelijk. maar google eens op faux columns, misschien dat dat je wat oplevert.

in dit geval zou je misschien beter de anchors in je _deco kunnen zetten? dan wordt deze automatisch opgerekt. als je _deco een backgroundimage/color/whatever meegeeft en deze positioneerd zou je denk ik hetzelfde kunnen bereiken. Een beetje creatief denken zeg maar
As a rule, I never touch anything more sophisticated and delicate than myself.
  zondag 16 juli 2006 @ 02:18:01 #293
11753 Roonaan
Strictly
pi_39868248
Kan je deco niet een container div van items maken met een padding-left erin?
pi_39913136
quote:
Op zondag 16 juli 2006 02:18 schreef Roönaän het volgende:
Kan je deco niet een container div van items maken met een padding-left erin?
Ik zat inderdaad weer veel te moeilijk te denken, thx!

Ik heb er wel weer een nieuw crossbrowserprobleem bij. Ik heb de code waar het om gaat hier staan. Zoals de site er in FF en Opera uit ziet is het goed. Maar in IE passen #content en #nav niet naast elkaar. Als ik #content 3 pixels smaller maak komen ze wél naast elkaar te staan in IE, maar inclusief een lelijk gapend gat. Hoe krijg ik dit in IE in orde?

Ik heb de 'zo-werkt-het-wel-in-IE-maar-ziet-het-er-niet-uit'-versie hier staan.
pi_39931512
@nevermind
je hebt 2x #content gedefineerd met verschillende widths

tevens zie ik in #nav een float staan, maar in #content niet. Je zou kunnen proberen om #nav een display: inline; te kunnen geven aangezien IE soms de margins wil verdubbelen.
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_39933638
quote:
Op dinsdag 18 juli 2006 09:29 schreef Desdinova het volgende:
@nevermind
je hebt 2x #content gedefineerd met verschillende widths
Dat was inderdaad een domme fout Heeft verder geen effect op het resultaat.
quote:
tevens zie ik in #nav een float staan, maar in #content niet. Je zou kunnen proberen om #nav een display: inline; te kunnen geven aangezien IE soms de margins wil verdubbelen.
Ze hoeven toch ook niet beide een float te hebben? Of heb ik mijn basis-CSS verkeerd begrepen? Met display: inline verandert er helaas niets. Ik heb de nieuwe versie geupload naar dezelfde locatie.
pi_39933809
geef je #content een float: left;
dat fixed het bij mij
display inline kan weer weg

edit
waarschijnlijk komt dat omdat je body een text-align center heeft, en IE zonder problemen alles gecentreerd uitlijnt, in tegenstelling tot de degelijke browsers. en aangezien #content geen margin: 0 auto; heeft wordt er blijkbaar niet naar geluisterd door FF, waardoor hij hem gewoon default links knalt.
denk ik.
As a rule, I never touch anything more sophisticated and delicate than myself.
pi_39934019
quote:
Op dinsdag 18 juli 2006 11:17 schreef Desdinova het volgende:
geef je #content een float: left;
dat fixed het bij mij
display inline kan weer weg
Yes! Hartstikke bedankt!
quote:
edit
waarschijnlijk komt dat omdat je body een text-align center heeft, en IE zonder problemen alles gecentreerd uitlijnt, in tegenstelling tot de degelijke browsers. en aangezien #content geen margin: 0 auto; heeft wordt er blijkbaar niet naar geluisterd door FF, waardoor hij hem gewoon default links knalt.
denk ik.
Ik ben benieuwd of dat het is! Dit zijn meestal de dingen waardoor ik depri word wanneer ik een layout geheel in CSS probeer te maken en waardoor ik doorgaans weer terugval op tabellen. Bedankt voor je hulp en de verklaring
pi_40086628
quote:
Op dinsdag 18 juli 2006 11:17 schreef Desdinova het volgende:
geef je #content een float: left;
dat fixed het bij mij
display inline kan weer weg

edit
waarschijnlijk komt dat omdat je body een text-align center heeft, en IE zonder problemen alles gecentreerd uitlijnt, in tegenstelling tot de degelijke browsers. en aangezien #content geen margin: 0 auto; heeft wordt er blijkbaar niet naar geluisterd door FF, waardoor hij hem gewoon default links knalt.
denk ik.
dat klopt.
margin: auto; verdeeld de margin tussen links en rechts. IE ondersteund dit niet en daarom moet je text-align: center; gebruiken. erg logisch
pi_40113643
Ik wil graag 2 div'sonder elkaar zetten. De hoogte van de tabellen kan varieren. Daarnaast kan het zo zijn dat de bovenste div niet geladen wordt op de pagina omdat deze niet relevant is.
Als ik het goed begrepen heb dien ik een container aan te maken die de 2 div's omvat. Met deze container kan ik de absolute positie van de 2 bovenelkaar geplaatste div bepalen.
maar hoe bepaal ik nu de positie van de div's in die container? En hoe klrijg ik ze netjes bovenelkaar, ongeacht de hoogte van de div?
pi_40115018
Gewoon niet.

Vul enkel een width in, die gelijk is aan de width van de containerdiv.

Nu zal de 2de div niet meer naast de eerste geplaatst kunnen worden, en zal ie er dus onder zitten. Niets met absolute posities klooien dus.

hmmm, vol:

deze niet: [CSS] voor dummies - Deel 5

[ Bericht 23% gewijzigd door the_disheaver op 23-07-2006 22:31:35 ]
abonnement bol.com Unibet Coolblue
Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')