[CSS] voor dummies - deel 12

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
pi_70977876
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		#container { 
    width:802px;
    height: 80%;
    margin: 0; 
    } 
#div1 { 
    background: #000000; 
    width: 32%; 
    float:left;
    border:thin #CCCCCC solid;
    background-color:#1A1A1A;
    } 

#div2 { 
    background: #000000; 
    width: 32%; 
    float:left;
    border:thin #CCCCCC solid;
    background-color:#1A1A1A;
    }

#div3 { 
    background: #555555; 
    width: 65%; 
    height: 80%;
    float: right;
    border:thin #CCCCCC solid;
    background-color:#1A1A1A;
    }



HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17		<div id="container" >
      <div id="div3"><div class=menuheader>
        <div class=contentitemheader>test</div>
          <div class=contentitem></div>
       </div></div>
  <div id="Menu">
      <div id="div1">
        <div class=menuheader><b>Karting menu</b></div>
          <div class=menuitem>Menu items uit database</div>
          <br>
          </div>
      <div id="div2">
         <div class=menuheader><b>Autocross menu</b></div>
          <div class=menuitem>Menu items uit database</div>
          </div>
       </div>   
      </div>
pi_70978161
Waarom staat je content nou dan ineens weer vóór je menu?
—o—
pi_70978238
Ohja sorry, ik was allang aan het trial en erroren.
Zal het weer even terug zetten.
pi_70978286
doe eens
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18		<div id="container" >
  <div id="Menu">
      <div id="div1">
        <div class=menuheader><b>Karting menu</b></div>
          <div class=menuitem>Menu items uit database</div>
          <br>
          </div>
      <div id="div2">
         <div class=menuheader><b>Autocross menu</b></div>
          <div class=menuitem>Menu items uit database</div>
          </div>
       </div>   
      <div id="div3"><div class=menuheader>
        <div class=contentitemheader>test</div>
          <div class=contentitem></div>
       </div></div>

      </div>

1
2		#menu {float: left; width: 32%; background:red;}
#div3 {width:65%; background:green;}

en verder niets.
Niet getest maar kan haast niet fout gaan.
—o—
pi_70978784
"en verder niets"

Maak eens een testcase, anders kom je nergens.
—o—
pi_70978869
Ja, dat werkt goed.
pi_70979358
Ben hem overnieuw aan het opbouwen, alleen krijg ook RSI kramp ofzo.
Zit al te lang achter de pc :p, ik kijk morgen weer even verder.

Bedankt voor de hulp Doppendoosch en Chanty87
  FOK!-Schrikkelbaas dinsdag 14 juli 2009 @ 22:54:06 #209
1972 Swetsenegger
Egocentrische Narcist
pi_70984318
waarom past webkit (safari en chrome) een background image met position bottom in de <col> tag toe op elke regel en niet, zoals het hoort, op de volledige kolom. En belangrijker... is er een workaround voor?
 | FOK! Schrikkelbaasch
pi_71114738
edit: opgelost.

[ Bericht 97% gewijzigd door DirkZz op 19-07-2009 12:48:14 ]
  woensdag 22 juli 2009 @ 01:16:40 #211
241594 iBolt
Lighting
pi_71202671
Vraagje...

Ik heb een div.

.abc{
padding:10px 7px;
border:1px solid #e8e8e8;
font-size:12px;
color:#777;
font-style:italic;
text-align:center;
background-color:#f3f3f3
}

<div class="abc">
<img scr=".../plaatje.jpg" />
</div>

Nu is het zo dat mijn div zich over de hele breedte uitstrekt ik wil echter dat hij zo breed wordt als het plaatje... hoe doe ik dit?

[ Bericht 0% gewijzigd door iBolt op 22-07-2009 02:11:22 ]
pi_71202891
Geen div gebruiken maar een span.

Maar:
a) waarom uberhaupt een extra element om de afbeelding heen? sorry zitten nog wat paddings in zie ik
b) beetje onoverzichtelijk om je classes namen te geven die ook standaard HTML-elementen zijn lijkt me...
—o—
  woensdag 22 juli 2009 @ 02:11:04 #213
241594 iBolt
Lighting
pi_71203279
quote:
Op woensdag 22 juli 2009 01:32 schreef doppendoosch het volgende:
Geen div gebruiken maar een span.

Maar:
a) waarom uberhaupt een extra element om de afbeelding heen? sorry zitten nog wat paddings in zie ik
b) beetje onoverzichtelijk om je classes namen te geven die ook standaard HTML-elementen zijn lijkt me...
ja sorry class heet ook niet a maar had gewoon even snel getypt + copy past :p
pi_71204217
quote:
Op woensdag 22 juli 2009 01:32 schreef doppendoosch het volgende:
Geen div gebruiken maar een span.

Maar:
waarom uberhaupt een extra element om de afbeelding heen? sorry zitten nog wat paddings in zie ik
Die paddings zijn geen reden om een extra element om een img te zetten. Een img is gewoon een element en kun je als zodanig aanpassen, inclusief margin, padding achtergrondkleur en zelfs achtergrondafbeelding.
fokstok.nl
  woensdag 22 juli 2009 @ 11:08:20 #215
241594 iBolt
Lighting
pi_71207937
quote:
Op woensdag 22 juli 2009 07:18 schreef Light het volgende:

[..]

Die paddings zijn geen reden om een extra element om een img te zetten. Een img is gewoon een element en kun je als zodanig aanpassen, inclusief margin, padding achtergrondkleur en zelfs achtergrondafbeelding.
Klopt maar die box moet niet perse om een img kunnen ook andere elemente zijn video, tabel...

Span werkt trouwens niet

zal even me code geven....
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19		.wp-caption{ 
   padding:10px 7px; 
   border:1px solid #e8e8e8; 
   font-size:12px; 
   color:#777; 
   font-style:italic; 
   text-align:center; 
   background-color:#f3f3f3 
}
p.wp-caption-text{ 
   margin:10px 0 0 0 !important; 
   padding:0; 
   line-height:14px !important; 
}
.aligncenter, div.aligncenter{ 
   display:block; 
   margin-left:auto; 
   margin-right:auto; 
}


en bijvoorbeeld dan dit als input...

1
2
3
4		<div class="wp-caption aligncenter">
<img data-src="http://psplessen.hewejosplace.nl/Betty_Boop_plaatje.jpg" style="visibility:hidden;" />
<p class="wp-caption-text">Betty Boop</p>
</div>


[ Bericht 27% gewijzigd door iBolt op 22-07-2009 11:25:57 ]
pi_71208464
quote:
Op woensdag 22 juli 2009 @ 11:08 schreef iBolt het volgende:

[..]

Klopt maar die box moet niet perse om een img kunnen ook andere elemente zijn video, tabel...
En die kun je geen class geven omdat....?

-edit-
quote:
Op woensdag 22 juli 2009 @ 11:08 schreef iBolt het volgende:

[..]
Span werkt trouwens niet

zal even me code geven....
[ code verwijderd ]

en bijvoorbeeld dan dit als input...
[ code verwijderd ]
Nee allicht, als je die span display:block geeft heb je die heel effectief omgetoverd in een div
—o—
  woensdag 22 juli 2009 @ 12:11:00 #217
241594 iBolt
Lighting
pi_71210025
quote:
Op woensdag 22 juli 2009 11:26 schreef doppendoosch het volgende:

[..]

En die kun je geen class geven omdat....?

-edit-
[..]

Nee allicht, als je die span display:block geeft heb je die heel effectief omgetoverd in een div
Ja sorry ik ben noob met css iig heb nu weggehaald en doet het half... enigste wat ontbreekt is dat de span niet zo hoog wordt als het plaatje... hij trekt dus alleen een box om het onderste deel van 't plaatje...
pi_71216821
Heeft iemand hier ervaring mee? http://code.google.com/p/ie7-js/

Werkt het een beetje? Ik heb geen IE6, dus ik kan het helaas niet testen...
Trotse poster van het 37000000ste bericht ^O^
pi_71217120
Geen idee of het een beetje werkt, maar ik heb nogal mijn twijfels of je een script van 90KB moet willen toevoegen aan je site, om een paar incompatibility-fixes te doen die je met een klein beetje speurwerk ook wel zelf op kunt lossen.
—o—
pi_71217266
quote:
Op woensdag 22 juli 2009 15:37 schreef doppendoosch het volgende:
Geen idee of het een beetje werkt, maar ik heb nogal mijn twijfels of je een script van 90KB moet willen toevoegen aan je site, om een paar incompatibility-fixes te doen die je met een klein beetje speurwerk ook wel zelf op kunt lossen.
Ik snap alleen niet hoe ik mijn sites in IE6 moet testen als ik Vista draai. Die Virtual Machines lijken niet te werken op Vista...
Trotse poster van het 37000000ste bericht ^O^
pi_71217423
http://www.my-debugbar.com/wiki/IETester/HomePage
http://browsershots.org/

Verder zou ik er ook met zo'n scriptje niet zonder meer vanuit gaan dat je die browsers niet meer hoeft te testen.
—o—
pi_71217907
quote:
Op woensdag 22 juli 2009 15:44 schreef doppendoosch het volgende:
http://www.my-debugbar.com/wiki/IETester/HomePage
http://browsershots.org/

Verder zou ik er ook met zo'n scriptje niet zonder meer vanuit gaan dat je die browsers niet meer hoeft te testen.
Die IETester ziet er wel goed uit.. Zijn de resultaten ervan betrouwbaar?
Het lijkt weinig uit te maken of ik het script waar ik het net over had ingeschakeld heb of niet. Wat wel op viel is dat de volgende syntax wél werkt door het script:

1
2
3
4
5
6
7
8
9
10
11
12
13
14		table tr td {
  border-top: 1px solid #888;
  border-left: 1px solid #888;
  padding: 5px;
  width: 25%;
  text-align: left;
  vertical-align: bottom;
}
table tr:first-child td {
  border-top: 0;
}
table tr td:first-child {
  border-left: 0;
}


om een tabel te maken met alleen aan de binnenkant borders.

Selectors werken dus, waardoor je veel geavanceerdere CSS-technieken kan gaan gebruiken

edit: Voor IE5.5 maakt het wel een wereld van verschil, zie ik nu. Pagina ziet er veel meer uit zoals in Mozilla

[ Bericht 3% gewijzigd door daReaper op 22-07-2009 16:39:44 ]
Trotse poster van het 37000000ste bericht ^O^
pi_71218697
quote:
Op woensdag 22 juli 2009 15:41 schreef daReaper het volgende:

Ik snap alleen niet hoe ik mijn sites in IE6 moet testen als ik Vista draai. Die Virtual Machines lijken niet te werken op Vista...
http://finalbuilds.edskes.net/iecollection.htm
pi_71220857
quote:
Op woensdag 22 juli 2009 16:42 schreef Chanty87 het volgende:
http://mashable.com/2009/07/16/ie6-must-die/
http://www.techcrunch.com(...)internet-explorer-6/
http://www.techcrunch.com(...)ie6-support-goodbye/


Voor mijn eigen site wil ik best IE6 bannen, maar dit is voor een klant die een webshop in rusland wil draaien, en daar is internet nog niet overal zo ver ontwikkeld, dus zijn er nog een hoop IE6-gebruikers, die dan dus geen klant zullen zijn.
Trotse poster van het 37000000ste bericht ^O^
pi_71221537
Wat dacht je van een paar linkjes naar IE8 of Firefox? Doe ik ook We kunnen niet voor eeuwig IE6 ondersteunen omdat sommigen nog in 2001 leven en te lui zijn om te updaten. Ik heb net voor het eerst een "nieuwe generatie" theme gemaakt voor Wordpress en het is heerlijk om niet constant IE6 in je achterhoofd te hoeven houden en achteraf PNG hacks, ie6fixes.css e.d. te moeten implementeren
シ
pi_71221789
quote:
Op woensdag 22 juli 2009 17:33 schreef Chanty87 het volgende:
Wat dacht je van een paar linkjes naar IE8 of Firefox? Doe ik ook We kunnen niet voor eeuwig IE6 ondersteunen omdat sommigen nog in 2001 leven en te lui zijn om te updaten. Ik heb net voor het eerst een "nieuwe generatie" theme gemaakt voor Wordpress en het is heerlijk om niet constant IE6 in je achterhoofd te hoeven houden en achteraf PNG hacks, ie6fixes.css e.d. te moeten implementeren
De klant is koning, en als de koning lui is, dan moet ik me als winkelier daar maar op aanpassen
Trotse poster van het 37000000ste bericht ^O^
pi_71222239
Youtube, Digg en 37signals dachten er ook zo over Maar prima hoor, jouw keuze Ik verspil mijn tijd niet meer aan IE6 (tenzij de klant echt zeker weten IE6 support wil voor een extra bedrag). Zeker niet nu de grote sites er ook mee kappen. Hoe meer designers/developers de ondersteuning laten vallen des te sneller we van die kutbrowser af zijn.
シ
pi_71240695
quote:
Op woensdag 22 juli 2009 17:13 schreef daReaper het volgende:

Voor mijn eigen site wil ik best IE6 bannen, maar dit is voor een klant die een webshop in rusland wil draaien, en daar is internet nog niet overal zo ver ontwikkeld, dus zijn er nog een hoop IE6-gebruikers, die dan dus geen klant zullen zijn.
Er zit een verschil tussen een site niet laten werken in IE6 en er iets anders uit laten zien in IE6. Nu is jouw geval wellicht anders, maar standaard zorg ik ervoor dat een site werkt in IE6. Ik vertel mijn klant vantevoren dat de site er misschien in details anders uit ziet (door het gebrek aan :last-child krijgt de laatste rij in een tabel tóch een randje eronder, etc). Wil je het pixel perfect in IE6: prima. Maar dan gaan we daar wel eerst een begroting voor maken
pi_71240779
quote:
Op woensdag 22 juli 2009 17:33 schreef Chanty87 het volgende:
Wat dacht je van een paar linkjes naar IE8 of Firefox? Doe ik ook We kunnen niet voor eeuwig IE6 ondersteunen omdat sommigen nog in 2001 leven en te lui zijn om te updaten.
Da's niet echt waar, recent onderzoek toont aan dat van de IE6 gebruikers slechts ongeveer 14% thuisgebruikers zijn. De overige 86% zijn mensen die het op hun werk moeten gebruiken, en die kunnen niet upgraden. Dat die bedrijven niet upgraden, daar hebben ze een goede reden voor: ze hebben 8 jaar geleden web apps laten bouwen door prutsers, die alleen in IE6 werken. Als ze moeten kiezen tussen YouTube goed tonen, of hun app die een ton gekost heeft laten werken, dan is de keuze snel gemaakt. Zolang de pruts apps niet uitgefaseerd zijn blijft een groot deel van werkend Nederland IE6 gebruiken.
pi_71242335
quote:
Op donderdag 23 juli 2009 09:19 schreef Roy_T het volgende:

[..]

Er zit een verschil tussen een site niet laten werken in IE6 en er iets anders uit laten zien in IE6. Nu is jouw geval wellicht anders, maar standaard zorg ik ervoor dat een site werkt in IE6. Ik vertel mijn klant vantevoren dat de site er misschien in details anders uit ziet (door het gebrek aan :last-child krijgt de laatste rij in een tabel tóch een randje eronder, etc). Wil je het pixel perfect in IE6: prima. Maar dan gaan we daar wel eerst een begroting voor maken
Ahja, zoals het er nu uit ziet in IE6 ben ik op zich tevreden, hoewel het inderdaad niet perfect is. en :last-child werkt door dat script dus wèl
Trotse poster van het 37000000ste bericht ^O^
pi_71246137
quote:
Op donderdag 23 juli 2009 10:27 schreef daReaper het volgende:

Ahja, zoals het er nu uit ziet in IE6 ben ik op zich tevreden, hoewel het inderdaad niet perfect is. en :last-child werkt door dat script dus wèl
Nee, :last-child werkt niet, maar dat zie je niet omdat dat script het gedrag van :last-child nadoet Maar dan ben je nu opeens afhankelijk van JavaScript, of dat nou echt een beter alternatief is, daar kun je over discussiëren
pi_71246833
quote:
Op donderdag 23 juli 2009 09:19 schreef Roy_T het volgende:

(door het gebrek aan :last-child krijgt de laatste rij in een tabel tóch een randje eronder, etc). Wil je het pixel perfect in IE6: prima. Maar dan gaan we daar wel eerst een begroting voor maken
:last-child werkt ook niet in IE7, voor zover ik weet. En meeestal kun je het met :first-child ook wel oplossen (maar ook die werkt niet in IE6).
fokstok.nl
pi_71247094
quote:
Op donderdag 23 juli 2009 09:23 schreef Roy_T het volgende:

[..]

Da's niet echt waar, recent onderzoek toont aan dat van de IE6 gebruikers slechts ongeveer 14% thuisgebruikers zijn. De overige 86% zijn mensen die het op hun werk moeten gebruiken, en die kunnen niet upgraden. Dat die bedrijven niet upgraden, daar hebben ze een goede reden voor: ze hebben 8 jaar geleden web apps laten bouwen door prutsers, die alleen in IE6 werken. Als ze moeten kiezen tussen YouTube goed tonen, of hun app die een ton gekost heeft laten werken, dan is de keuze snel gemaakt. Zolang de pruts apps niet uitgefaseerd zijn blijft een groot deel van werkend Nederland IE6 gebruiken.
Ik heb het ook niet alleen over thuisgebruikers Door die bedrijven blijft het web constant steken. Het is de hoogste tijd om na 8 jaar IE6 met de volgende generatie te gaan werken ipv vernieuwing in de weg te blijven zitten omdat ze hun prutsapps niet willen updaten. Zolang iedere designer/developer IE6 blijft ondersteunen zal er nooit geupgradet worden omdat die noodzaak er niet is en dus sluit ik me maar al te graag aan bij YT, Digg en 37signals
シ
pi_71255332
quote:
Op donderdag 23 juli 2009 12:40 schreef Light het volgende:

:last-child werkt ook niet in IE7, voor zover ik weet
Jawel hoor :nth-child niet.
pi_71255538
quote:
Op donderdag 23 juli 2009 12:47 schreef Chanty87 het volgende:

Ik heb het ook niet alleen over thuisgebruikers Door die bedrijven blijft het web constant steken. Het is de hoogste tijd om na 8 jaar IE6 met de volgende generatie te gaan werken ipv vernieuwing in de weg te blijven zitten omdat ze hun prutsapps niet willen updaten. Zolang iedere designer/developer IE6 blijft ondersteunen zal er nooit geupgradet worden omdat die noodzaak er niet is en dus sluit ik me maar al te graag aan bij YT, Digg en 37signals
Van de bedrijven die je noemt is 37signals de enige die winst boekt uit verkopen van een dienst, en die hebben echt andere klanten dan de bedrijven die een paar ton aan een web app uitgeven. Dat is iets anders dan max 99$ voor Basecamp.

Ik ben het helemaal met je eens dat IE6 er zo snel mogelijk uit moet, en dat iedereen (ook bedrijven) zou moeten upgraden. Maar dat neemt niet weg dat ik heel goed begrijp waarom een TNT of een Rabobank dat niet doen. Een groot deel van hun processen valt stil als ze upgraden naar een browser waar hun apps niet mee werken. Het is, zeker nu, een stuk voordeliger om dan maar IE6 te houden ipv veel geld uit te geven aan nieuwe apps.
pi_71256172
quote:
Op donderdag 23 juli 2009 16:52 schreef Roy_T het volgende:

[..]

Jawel hoor :) :nth-child niet.
:last-child ook niet. Is trouwens een css3 ding, net als :nth-child.

Ik heb het getest met onderstaande html/css:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22		<!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>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Test</title>
<style type="text/css">
#test {
   color: red;
}
#test :last-child {
   color: green;
}
</style>
</head>
<body>
<div id="test">
   <p>Child 1</p>
   <p>Child 2</p>
   <p>Child 3</p>
</div>
</body>
</html>
fokstok.nl
pi_71266026
quote:
Op donderdag 23 juli 2009 17:14 schreef Light het volgende:

:last-child ook niet. Is trouwens een css3 ding, net als :nth-child.
Je hebt gelijk. Ik was in de war met :first-child (wat weer CSS 2.1 is en wél werkt in IE7).
  zondag 26 juli 2009 @ 22:22:43 #239
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_71350942
Ik kom niet uit het volgende:

HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15		<div class="topsteden">
   <div class="cities">
      <div class="city" id="1">
         <div class="image"><img src="/images/amsterdam.jpg" alt="Amsterdam" width="80" /></div>
         <div class="title"><a href="#">Amsterdam</a></div>
         <div class="rating"><img src="/images/star.png" alt="nvt" /></div>
         <div class="text">Amsterdam is de hoofdstad van Nederland en mag aanspraak maken op de titel "Wereldstad". Vele verschillende kanten van Nederland zie je hier in een stad. Oude gebouwen, moderne architectuur, natuur, musea en nog veel meer. <a href="#" style="font-size: 10px;" class="border"><i>(lees verder...)</i></a></div>
      </div>
      <div class="city" id="2">
         <div class="image"><img src="/images/den_haag.jpg" alt="Den Haag" width="80" /></div>
         <div class="title"><a href="#">Den Haag</a></div>
         <div class="rating"><img src="/images/star.png" alt="nvt" /></div>
         <div class="text">bsdfgh fdfg dsfgvbsdasdf lablabla</div>
      </div>
</div>


CSS:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18		/* topsteden */
.topsteden {}
.topsteden .menu { text-align: center;}
.topsteden .cities {position: relative; top: 15px;}
.topsteden .cities .city {position: relative; top: 10px; padding: 10px; height: 95px;}
.topsteden .cities .city .image {
   position: relative;
   float: left;
   width: 85px;
   height: 85px;
   border:1px solid gray;
   padding-left: 5px;
   padding-top: 5px;
   left: 5px;
}
.topsteden .cities .city .title {position: relative; left: 13px; float:left; font-weight: bold;}
.topsteden .cities .city .rating {position: relative; left: 130px;}
.topsteden .cities .city .text {position: absolute; left: 110px; top: 20px;font-size: 10px;}


Is mijn opbouw (css) goed zo? want ik heb het idee als ik in .topsteden .cities { } padding: 5px; doe, dat die voor alle andere ook geldt?
pi_71351252
Voor welke anderen?

Je HTML is verder redelijk ruk overigens Divitis is net zo erg als tabellen Waarom .text ipv <p>, waarom .title ipv <hn>?
pi_71351448
tvp
  zondag 26 juli 2009 @ 22:43:19 #242
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_71351633
quote:
Op zondag 26 juli 2009 22:33 schreef Roy_T het volgende:
Voor welke anderen?

Je HTML is verder redelijk ruk overigens Divitis is net zo erg als tabellen Waarom .text ipv <p>, waarom .title ipv <hn>?
Voor topsteden .cities .city en topsteden .cities .city .images etc. bijvoorbeeld
Je hebt idd gelijkt betreffende die .text en .title :0
pi_71352767
quote:
Op zondag 26 juli 2009 22:43 schreef Likkende_Lassie het volgende:

[..]

Voor topsteden .cities .city en topsteden .cities .city .images etc. bijvoorbeeld
Je hebt idd gelijkt betreffende die .text en .title :0
Je bedoelt dat .cities een lijst met steden is en .city een losse stad? Waarom dan niet <ul> en <li> gebruiken? Die zijn speciaal voor lijsten gemaakt
fokstok.nl
pi_71357965
Als je in ".topsteden .cities {position: relative; top: 15px;}" padding toevoegt, dan heeft dat alleen effect op de div met class="cities".
  maandag 27 juli 2009 @ 10:41:48 #245
85919 Likkende_Lassie
Doe eens wat aan je ondertitel
pi_71358713
quote:
Op maandag 27 juli 2009 10:03 schreef Roy_T het volgende:
Als je in ".topsteden .cities {position: relative; top: 15px;}" padding toevoegt, dan heeft dat alleen effect op de div met class="cities".
En niet op de gehele div .topsteden?
pi_71359193
quote:
Op maandag 27 juli 2009 10:41 schreef Likkende_Lassie het volgende:

[..]

En niet op de gehele div .topsteden?
Nee. Alleen op de div .cities in de div .topsteden.
fokstok.nl
pi_71359338
quote:
Op maandag 27 juli 2009 10:41 schreef Likkende_Lassie het volgende:

En niet op de gehele div .topsteden?
Nee. Je bent niet in de war met margin ofzo? Niet dat het daarvoor wel geldt, maar dan is het op het eerste gezicht moeilijker om te zien of de ruimte door padding op de ouder of margin op het kind komt.
  dinsdag 28 juli 2009 @ 16:05:35 #248
241594 iBolt
Lighting
pi_71399196
Ander dingetje... Ik heb zeg maar zo'n collapse/expand gevalletje wat er ongeveer zo uitziet...

1
2
3
4		<a href="#" onclick"toggle('id1')">Collapse 1</a><div id="id1" style="display:none;">Blaat 1</div>
<a href="#" onclick"toggle('id2')">Collapse 2</a><div id="id2" style="display:none;">Blaat 2</div>
<a href="#" onclick"toggle('id3')">Collapse 3</a><div id="id3" style="display:none;">Blaat 3</div>
<a href="#" onclick"toggle('id4')">Collapse 3</a><div id="id4" style="display:none;">Blaat 4</div>

Nu werkt het allemaal fijn alleen zit er zeg maar nu zo'n lelijke ruimte ruimte, witregel, tussen me links... en die wil ik weghebben... padding en margin veranderen helpt niet (als div weg is is witregel ook weg ofcourse)
pi_71399822
quote:
Op dinsdag 28 juli 2009 16:05 schreef iBolt het volgende:
Ander dingetje... Ik heb zeg maar zo'n collapse/expand gevalletje wat er ongeveer zo uitziet...
[ code verwijderd ]

Nu werkt het allemaal fijn alleen zit er zeg maar nu zo'n lelijke ruimte ruimte, witregel, tussen me links... en die wil ik weghebben... padding en margin veranderen helpt niet (als div weg is is witregel ook weg ofcourse)
Lineheight aanpassen?
pi_71400882
quote:
Op dinsdag 28 juli 2009 16:05 schreef iBolt het volgende:
Ander dingetje... Ik heb zeg maar zo'n collapse/expand gevalletje wat er ongeveer zo uitziet...
[ code verwijderd ]

Nu werkt het allemaal fijn alleen zit er zeg maar nu zo'n lelijke ruimte ruimte, witregel, tussen me links... en die wil ik weghebben... padding en margin veranderen helpt niet (als div weg is is witregel ook weg ofcourse)
Wat wil je bereiken? Op het moment dat er geen div aan staat, is er ook geen witruimte en staan ze gewoon achter elkaar. Als er een div aan staat, dan staat er ook inhoud in neem ik aan?
actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
[CSS] voor dummies - deel 12
Index

» digital corner

» development

Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')