[CSS] voor dummies #14

Index

» digital corner

» development

actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
pi_81534691
Ola,

Mooi dat er een CSS topic op FOK! is, nu hoop ik dat jullie mij willen kunnen helpen!

Ik heb een horizontaal menu gemaakt uit een ul:
1
2
3
4
5
6
7
8		         <div id="navigation">
            <ul>
               <li><a class="current" href="#">Menu 1</a></li>
               <li><a href="#">Menu 2</a></li>
               <li><a href="#">Menu 3</a></li>
               <li><a href="#">Menu 4</a></li>
            </ul>
         </div> <!-- #navigation ends here -->

En dat word hier gestyled:
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		#navigation {
   border: none;
   font-size: 80%;
   margin-left: 12.5em; /*200px*/
   margin-right: 1.25em; /*20px*/
   padding: .5em 0 .2em .5em; /*8px 0 3px 8px*/
   text-align: right;
}
#navigation ul li {
   display: inline;
   font-weight: bold;
}
#navigation a:link, a:visited {
   border: 1px solid #5e656b;
   color: #5e656b;
   padding: .5em .5em .2em .5em; /*8px 8px 3px 8px*/
   text-decoration: none;
}
#navigation a:hover, a:active {
   background-color: #ecf3f5;
   border: 1px solid #0073c8;
   border-bottom: 1px solid #ecf3f5;
   color: #0073c8;
   padding: .5em .5em .2em .5em; /*8px 8px 3px 8px*/
   text-decoration: none;
}
#navigation a.current {
   background-color: #ecf3f5;
   border: 1px solid #0073c8;
   border-bottom: 1px solid #ecf3f5;
   color: #0073c8;
   padding: .5em .5em .2em .5em; /*8px 8px 3px 8px*/
   text-decoration: none;
}

Zoals je ziet heeft de eerste li in ul een class genaamd current. Dat is ervoor te zorgen dat de current tab in het menu duidelijk zichtbaar is. Dat even tussen 2 haakjes, want hier komt het probleem:
Ik krijg op geen enkele manier voor elkaar dat linkjes anders gestyled worden dan het menu! Rara, waar zou ik wat moeten veranderen?

Alvast bedankt voor jullie hulp :*
  maandag 17 mei 2010 @ 15:42:25 #202
182073 invine
blablabla etc.
pi_81536953
-nvm-
Ik drink nooit meer! maar ook niet minder.
pi_81541894
@geodriehoek

1#navigation a:link, a:visited


doet niet wat jij denkt dat ie doet. Hij selecteert nu alle a:links in #navigation PLUS alle visited links (dus ook de links buiten #navigation (dit doe je overigens op meer plekken in je CSS).

1
2		#navigation a:link, 
#navigation a:visited


Zo dus.

Voor de rest begrijp ik je vraag niet echt, bij mij is de huidige actieve tab gewoon een andere kleur - of bedoel je dat niet?
Nee.
pi_81546905
quote:
Op maandag 17 mei 2010 17:28 schreef PimD het volgende:
@geodriehoek
[ code verwijderd ]

doet niet wat jij denkt dat ie doet. Hij selecteert nu alle a:links in #navigation PLUS alle visited links (dus ook de links buiten #navigation (dit doe je overigens op meer plekken in je CSS).
[ code verwijderd ]

Zo dus.

Voor de rest begrijp ik je vraag niet echt, bij mij is de huidige actieve tab gewoon een andere kleur - of bedoel je dat niet?
Te gek PimD, dit lost mijn probleem op! Kan je, als je zin hebt, misschien uitleggen waarom mijn manier niet werkte?

Mijn zinnetje over die actieve tab was simpelweg extra info voor degene die zich afvroegen waarom er een class was toegwezen. Was verder niet bedoelt als vraag

Thanks a million!
pi_81547243
Tsja wat valt er uit te leggen. Je scheidt je CSS selectors met komma's, dus

1
2
3		#content a, span { 
....
}


selecteer alle a-hrefs in de div met de ID content PLUS alle span-elementen - waar dan ook. Als je dus alleen de a's en de spans wilt hebben in de div #content dan moet je

1
2
3
4		div#content a,
div#content span {
...
}


doen :)
Nee.
pi_81547558
quote:
Op maandag 17 mei 2010 19:23 schreef PimD het volgende:
Tsja wat valt er uit te leggen. Je scheidt je CSS selectors met komma's, dus
[ code verwijderd ]

selecteer alle a-hrefs in de div met de ID content PLUS alle span-elementen - waar dan ook. Als je dus alleen de a's en de spans wilt hebben in de div #content dan moet je
[ code verwijderd ]

doen
Yeah nu snap ik hem, dank!
  dinsdag 25 mei 2010 @ 11:43:05 #207
69950 MadGuy
Fever Ray
pi_81863920
Hallo beste experts,

Misschien kunnen jullie mij ook helpen met een IE-probleempje.

Het gaat om de thumbnails op deze pagina: KLIK!

In Firefox, Chrome en Safari zien de marges tussen de thumbnails er perfect uit, alleen IE sputtert een beetje tegen. De marges onder (of boven - net hoe je er tegenaan kijkt) zijn verdwenen. Wie weet er een oplossing voor IE om deze marges toch goed te krijgen, zonder dat Firefox, Chrome en Safari dubbele marges gaan rekenen?

Dit is de bijbehorende 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		#mainbodyportf {
   width: 800px;
   min-height: 200px;
   margin-top: 30px;
   font: normal 12px Verdana;
   color: #333;
   line-height: 1.5em;
}

ul.portf {
   float: right;
   display: inline;
   width: 275px;
   list-style-type: none;
}

li.portf {
   float: left;
   margin-left: 5px;
}

li img {
   border: none;
}
last.fm
marksluymers.nl
pi_81864459
1
2
3
4
5
6
7
8
9		* {
   list-style-image: none;
   list-style-position: outside;
   list-style-type: none;
   margin: 0;
   padding: 0;
   outline-style: none;
   outline-width: 0;
}

Haal dat eens weg ofzo.

Heb helaas (gelukkig ) geen IE hier dus kan verder niet testen.
zcflevo.nl
  dinsdag 25 mei 2010 @ 12:56:35 #209
69950 MadGuy
Fever Ray
pi_81866501
Bedankt voor je suggestie. Het helpt helaas niet.

En je hebt gelijk wat betreft IE.
last.fm
marksluymers.nl
pi_81873470
Ik heb het volgende probleem: Wanneer ik met JS de CSS-style van display none naar block verander van mijn tbody elementen, dan neemt de tbody niet de opgegeven breedte over.

Een voorbeeld is hier te zien. Het gaat om als je "theoriemateriaal" helemaal onderaan aanklikt, dan fout hij hem uit zoals het hoort, alleen de breedte klopt niet i.t.t. de tbodies daarboven.

Dit is de JS:
1
2
3
4		for (i = 0; i < $("los").select("[title='sub"+ID+"']").length; i = i + 1)
{
   ("los").select("[title='sub"+ID+"']")[i].style.display = "block";
}


Dit is de CSS:
1
2
3
4		div#body div#B div.wrapper div#content div.type table tbody.sub
{
   display: none; 
}
Aan dit bericht kunnen geen rechten worden ontleend.
pi_81873628
Waar heb je de breedte van de tbody ingesteld?
fokstok.nl
pi_81873829
quote:
Op dinsdag 25 mei 2010 15:58 schreef Light het volgende:
Waar heb je de breedte van de tbody ingesteld?
Nergens, maar hij moet de totale breedte te hebben van de th + 2x td's die er in staan, de breedte van de th lijkt hij na de display: block niet te herkennen.

Als ik trouwens de tbody op 500px instel, dan drukt hij de goede tbody te breed uit.
Aan dit bericht kunnen geen rechten worden ontleend.
pi_81875463
quote:
Op dinsdag 25 mei 2010 16:03 schreef poepeneesje het volgende:

[..]

Nergens, maar hij moet de totale breedte te hebben van de th + 2x td's die er in staan, de breedte van de th lijkt hij na de display: block niet te herkennen.

Als ik trouwens de tbody op 500px instel, dan drukt hij de goede tbody te breed uit.
Da's ook niet zo raar, als je van je table-element een block-element maakt, trekt'ie zich niets meer aan van de td's en th's die daar in staan.

Oh en crossposten is ook niet nodig hoor.
zcflevo.nl
pi_81875944
quote:
Op dinsdag 25 mei 2010 16:38 schreef KomtTijd... het volgende:

[..]

Da's ook niet zo raar, als je van je table-element een block-element maakt, trekt'ie zich niets meer aan van de td's en th's die daar in staan.

Oh en crossposten is ook niet nodig hoor.
Erg stom vanmezelf dat ik er niet aangedacht heb. De oplossing is dus display: table-row-group i.p.v. block.
Aan dit bericht kunnen geen rechten worden ontleend.
  zondag 30 mei 2010 @ 22:49:06 #215
87680 Mirel
Mirel wil een bongophone.
pi_82124223
edit
When all else fails, you always have delusion.
  zondag 30 mei 2010 @ 22:50:18 #216
134533 donroyco
dus niet Donroyco
pi_82124303
SPOILER
Om spoilers te kunnen lezen moet je zijn ingelogd. Je moet je daarvoor eerst gratis Registreren. Ook kun je spoilers niet lezen als je een ban hebt.
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
pi_82307607
Vraaaaagje:

Hoe kan ik via een knop een CSS-eigenschap veranderen? Is daar java voor nodig? Of kan het met html/css alleen?

Ik wil een knop (of meerdere) die de achtergrondkleur van de website verandert
  vrijdag 4 juni 2010 @ 00:21:35 #218
87680 Mirel
Mirel wil een bongophone.
pi_82312149
Je kan heel lomp doen dat als je in pagina1.html met stylesheet1.css bent en op een knop drukt dat je naar een identieke pagina2.html met stylesheet2.css gaat. Maar da's lomp.

Ik gok PHP.
When all else fails, you always have delusion.
pi_82312719
quote:
Op donderdag 3 juni 2010 22:49 schreef lkb9000 het volgende:
Vraaaaagje:

Hoe kan ik via een knop een CSS-eigenschap veranderen? Is daar java voor nodig? Of kan het met html/css alleen?

Ik wil een knop (of meerdere) die de achtergrondkleur van de website verandert
Een knop om de achtergrondkleur te veranderen? Dat kan, met een beetje Javascript. Geen Java, da's iets heel anders.
fokstok.nl
pi_82324937
Het is me gelukt met een simpel javascriptje, bedankt!

1
2
3
4
5
6
7
8
9
10
11
12		<script language="JavaScript">
var backColor = new Array(); 

backColor[0] = '#111111';
backColor[1] = '#222222';
backColor[2] = '#333333';
backColor[3] = '#444444';

function changeBG(whichColor){
document.bgColor = backColor[whichColor];
}
</script>

1
2
3
4		<a href="#" onMouseOver="javascript:changeBG(0)">Change</a>
<a href="#" onMouseOver="javascript:changeBG(1)">Change</a>
<a href="#" onMouseOver="javascript:changeBG(2)">Change</a>
<a href="#" onMouseOver="javascript:changeBG(3)">Change</a>


Ik heb alleen nog 1 probleem, dit werkt alleen als ik de background color uit de body css haal. Dit betekent dus dat de site altijd begint met een witte achtergrond.

Is dit via html/css te veranderen? Of moet ik iets aanpassen/toevoegen in het script? (en moet ik even in het javascript voor dummies topic aankloppen?)
pi_82326194
quote:
Op vrijdag 4 juni 2010 13:01 schreef lkb9000 het volgende:
Het is me gelukt met een simpel javascriptje, bedankt!
[ code verwijderd ]


[ code verwijderd ]

Ik heb alleen nog 1 probleem, dit werkt alleen als ik de background color uit de body css haal. Dit betekent dus dat de site altijd begint met een witte achtergrond.

Is dit via html/css te veranderen? Of moet ik iets aanpassen/toevoegen in het script? (en moet ik even in het javascript voor dummies topic aankloppen?)
document.bgColor lijkt me niet echt correct, dat zou op zijn minst moeten zijn document.body.style.backgroundColor, of document.getElementById('elementID').style.backgroundColor. Als je dat gebruikt moet het gewoon de CSS overrulen.
zcflevo.nl
pi_82326616
quote:
Op vrijdag 4 juni 2010 13:31 schreef KomtTijd... het volgende:

[..]

document.bgColor lijkt me niet echt correct, dat zou op zijn minst moeten zijn document.body.style.backgroundColor, of document.getElementById('elementID').style.backgroundColor. Als je dat gebruikt moet het gewoon de CSS overrulen.
Die eerste werkt perfect, geweldig!
pi_82348432
Ik heb nog een probleem

Ik heb een iframe waar ik een Nivo Slider in heb gebouwd, en deze werkt in FF & IE goed. Behalve in Chrome als ik de online versie bekijk (offline bekijken werkt gewoon goed), dan komt er een horizontale scrollbar terwijl ik op alle mogelijke plekken overflow op hidden heb staan.

Heeft iemand ervaring met zo'n probleem? Ik kan niet bedenken waar het aan kan liggen

http://lennartb.nl/2010/index1.html
Hier gaat het om, alvast bedankt!
  donderdag 10 juni 2010 @ 14:34:58 #224
25889 Sitethief
Fulltime Flapdrol
pi_82616879
1
2
3
4
5
6
7
8
9
10
11
12
13
14		<body>
   <div id="wrapper" style="margin: 0pt auto; width: 1000px;">
      <div id="bodyPan"> 
         <div id="boxBox">  
            <div id="profileBox">       
               Content A
            </div>
            <div id="companyBox">
               Content B
            </div> 
         </div>
      </div>
   </div>
</body>


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		body{
   background:url("plaatjezoveel.jpg") repeat-x scroll 0 -73px #A8A39D;
   color:#1A1917;
   font:14px/20px Arial,Helvetica,sans-serif;
   margin:10px 0 0;
   padding:0;
}
#bodyPan {
   background:url("plaatjezoveel2.jpg") no-repeat scroll 0 0 #FFFFFF;
   color:#1A1917;
   margin:0 auto;
   padding:10px 20px 20px;
   position:relative;
width:960px;
}
#boxBox {
   position:relative;
}
#companyBox {
   position:relative;
}
#profileBox {
   float:left;
   position:relative;
}

Probleem, hoogte is dynamisch, dat gaat verder lekker. Tot dat een block element in #boxBox een float eigenschap meekrijgt, dan krijgt he t#bodyPan erboven de hoogte van het kleinste element. (of geen hoogte als beide elementen een float hebben)
Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht &gt;:)
pi_82618273
overflow:hidden
zcflevo.nl
  donderdag 10 juni 2010 @ 15:06:08 #226
25889 Sitethief
Fulltime Flapdrol
pi_82618511
quote:
Op donderdag 10 juni 2010 15:00 schreef KomtTijd... het volgende:
overflow:hidden
Geniaal!
Dank je .
Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht &gt;:)
pi_82970372
vraagje
ik heb een site met een body en container, zodat de breedte altijd fixed is
nu wil ik een minimale hoogte aan de container meegeven zodat "korte" pagina's ook beeldvullend zijn
en zodat mijn footer altijd op de zelfde plaats staat (tenzij de pagina groter is natuurlijk)
met min-height: 800px; kom ik al een heel eind...alleen blijft mijn footer nu halverwege de pagina hangen.

Hoe kan ik zorgen dat de footer de min-height volgt?
pi_82973505
quote:
Op vrijdag 18 juni 2010 11:29 schreef MrNiles het volgende:
vraagje
ik heb een site met een body en container, zodat de breedte altijd fixed is
nu wil ik een minimale hoogte aan de container meegeven zodat "korte" pagina's ook beeldvullend zijn
en zodat mijn footer altijd op de zelfde plaats staat (tenzij de pagina groter is natuurlijk)
met min-height: 800px; kom ik al een heel eind...alleen blijft mijn footer nu halverwege de pagina hangen.

Hoe kan ik zorgen dat de footer de min-height volgt?
De makkelijkste oplossing is door in de container een div content te plaatsen en die een min-height te geven. Dan hoeft de container zelf geen min-height.
fokstok.nl
  vrijdag 18 juni 2010 @ 13:11:39 #229
25889 Sitethief
Fulltime Flapdrol
pi_82975244
1
2
3
4
5
6
7
8		   <div id="boxBox">  
            <div id="profileBox">
                  content
            </div>
            <div id="companyBox">
                  content
            </div>
   </div> 

1
2
3
4
5
6
7
8
9
10
11		#boxBox {
overflow:hidden;
position:relative;
}
#companyBox {
position:relative;
}
#profileBox {
float:left;
position:relative;
}


Ik krijg het wel voor elkaar om deze twee divjes naast elkaar in een container te zetten, maar ik kan geen afstand tussen de twee divjes zetten, zelfs niet met een margin.... Dwz, ik krijg er wel ruimte tussen, maar companyBox wordt dan erg klein, ik zie ook met Firebug dat hij op dezelfde plek als profielBox begint.
Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht &gt;:)
  vrijdag 18 juni 2010 @ 13:19:35 #230
25889 Sitethief
Fulltime Flapdrol
pi_82975640
Lamaar, companyBox had een dikke margin meegekregen
Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht &gt;:)
  vrijdag 18 juni 2010 @ 16:48:11 #231
37634 wobbel
Da WoBBeL King
pi_82988141
Ik denk dat deze in CSS hoort

Hieronder een gedeelte van mijn layout:



Nu dient het volgende probleem zich aan, zodra ik de pagina oproep met een anchor #specificaties oid dan verspringt de hele boel in Firefox en IE8...



Dat gaat dus niet goed...bekend probleem?
Hosted VoIP SIP trunks Vast mobiel VoIP
  vrijdag 18 juni 2010 @ 17:21:20 #232
254493 Trollface.
gr rob fruithof, groningencity
pi_82989658
Gebruik je frames ofzo?
★5731U★ Death from above '79★You're a woman, i'm a machinielsie ★ ✠ ★ Telkens weer een beetje sterven★ I was born in a winterstorm, i live there still★
pi_82989756
Heb je ergens de :target selector gebruikt in je CSS? Als ik het goed begrijp gaat het dus alleen mis als je #specificatis in je url hebt staan, en anders niet?
Nee.
  vrijdag 18 juni 2010 @ 17:32:55 #234
37634 wobbel
Da WoBBeL King
pi_82990078
quote:
Op vrijdag 18 juni 2010 17:21 schreef Trollface. het volgende:
Gebruik je frames ofzo?
Wat denk je zelf
quote:
Op vrijdag 18 juni 2010 17:23 schreef PimD het volgende:
Heb je ergens de :target selector gebruikt in je CSS? Als ik het goed begrijp gaat het dus alleen mis als je #specificatis in je url hebt staan, en anders niet?
Nee, zover ik weet nergens zelfs!
Hosted VoIP SIP trunks Vast mobiel VoIP
pi_82990124
Gooi eens een voorbeeld online dan?
Nee.
pi_83012751
je kan eens proberen om in de css van je div die wegvalt dit { clear:left; } er bij te zetten
is om afbeeldingen niet ergens achter te laten vallen dacht ik
heel goed ben ik er ook allemaal niet in maar bij mij werkte het wel bij een vergelijkend probleem
andere achtervoegingen kunnen zijn right of none of both (dacht ik...google weet het beter)
pi_83051026
Hoi, hoe geef je in CSS aan hoeveel witruimte er tussen iedere letter zit? Aangezien ik de goede benaming er niet voor weet, vindt google het ook niet Dus, dan vraag ik het hier.

pi_83051244
1letter-spacing: 0.5em;
Nee.
pi_83051422
quote:
Op zondag 20 juni 2010 13:11 schreef PimD het volgende:

[ code verwijderd ]

Thanks, even ergens opschrijven
  zondag 20 juni 2010 @ 22:05:48 #240
25889 Sitethief
Fulltime Flapdrol
pi_83075025
quote:
Op zondag 20 juni 2010 13:16 schreef RenRen- het volgende:

[..]

Thanks, even ergens opschrijven
Bookmark gewoon deze site: http://www.blooberry.com/indexdot/css/propindex/all.htm
Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht &gt;:)
  vrijdag 2 juli 2010 @ 15:01:34 #242
71610 Black-Hole
Deep in my soul
pi_83572075
Het lukt me maar niet om een formulier mooi op te maken in IE en FF terwijl de styling in Chrome en Safari het wel prima doet..... Wat er niet gebeurd in IE en FF is dat de input velden mooi uitgelijnd onder elkaar staan. Ze blijven zeg maar plakken achter de tekst die ervoor staat. Wie kan mij helpen?

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		<div id="form">
<form name="contactform" method="post" action="send_form_email.php">
<fieldset>   
<legend><p>Contact gegevens</p></legend>   
<ol>   
<li>   
  <label for="first_name"><p>Naam *</label>
  <input  type="text" name="first_name" size="35">
</li> 
<li>  
  <label for="last_name"><p>Bedrijf</label>
  <input  type="text" name="last_name" size="35">
</li> 
<li>  
  <label for="email"><p>E-mailadres *</label>
  <input  type="text" name="email" size="35">
</li> 
<li>  
  <label for="telephone"><p>Telefoon</label>
  <input  type="text" name="telephone" size="35">
  </li>   
</ol>   
</fieldset> 
  
<fieldset>   
<legend><p>Aanvraag diensten</p></legend>   
<ol>   
<li>   
<label for="dienst"><p>Gewenste dienst</label>
  <select name="dienst" name="dienst">
   <option>Nieuwe website</option>
   <option>Redesign bestaande website</option>
   <option>Anders, namelijk</option>
   </select>  
</li>  

<li>   
<label for="markt"><p>Markt</label>
  <select name="markt" name="markt">
   <option>MKB</option>
   <option>Non-profit</option>
   <option>Particulier</option>
   </select>  
</li>   
  
<li>  
  <label for="comments"><p>Bericht *</label>

  <textarea  name="comments" ></textarea>
</li>  
</ol> 

</fieldset>
  <input type="submit" value="Verstuur">   


</form>
</div> <!-- end form -->


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		fieldset li {
padding: 5px;
display: inline;
}

form label {     
float: left;
width: 10em;    
margin-right: 1em;   
}

fieldset li {    
float: left;    
clear: left;    
width: 100%;    
padding-bottom: 1em;  
}

fieldset{
float: left;      
clear: both;      
width: 100%;      
margin: 0 0 -1em 0;      
padding: 0 0 1em 0;  
}

form fieldset {
  border: 1px solid #1f6097;
  padding: 5px; 
  margin: 10px;        
}


textarea{
width: 250px;
height: 150px;
}
pi_83572478
Je kunt proberen het label een display:block te geven. Een label is normaal gesproken als ik me niet heel erg vergis een inline element, het geven van een width daaraan heeft geen zin tenzij je 'm als block-level element wil tonen.

Wel vreemd dat ie het volgens jou in Safari en Chrome wel doet, dat zou niet moeten kunnen volgens mij...
Nee.
  vrijdag 2 juli 2010 @ 15:16:14 #244
71610 Black-Hole
Deep in my soul
pi_83572680
quote:
Op vrijdag 2 juli 2010 15:11 schreef PimD het volgende:
Je kunt proberen het label een display:block te geven. Een label is normaal gesproken als ik me niet heel erg vergis een inline element, het geven van een width daaraan heeft geen zin tenzij je 'm als block-level element wil tonen.

Wel vreemd dat ie het volgens jou in Safari en Chrome wel doet, dat zou niet moeten kunnen volgens mij...
Dat maakt geen verschil helaas. Het verschil is er echt, je kan de pagina in werking zien op www.nionwebdesign.com/dev/offerte.html
pi_83573027
Ja gast, vind je het gek als je

1<label><p>Markt</label> 


doet ipv

1<label>Markt</label>




Je mist de </p> tag en hebt een block-level (p) element in een inline element (label) staan, wat de browser probeert op te lossen, door er

1<label></label><p>Markt
van te maken.

Als je nette HTML doet en een label een display:block geeft werkt het prima.
Nee.
  vrijdag 2 juli 2010 @ 21:20:24 #246
71610 Black-Hole
Deep in my soul
pi_83587845
Dat was het inderdaad, nu werkt het perfect!
  vrijdag 2 juli 2010 @ 22:39:07 #247
87680 Mirel
Mirel wil een bongophone.
pi_83590729
Vanwege dit soort foutjes vind ik dat mensen met Notepad++ moeten werken en niet iets zoals Dreamweaver. Notepad gaat veel beter om met begin en eindtags door ze te kleuren, strepen tussen elkaar te trekken, en het begin en eind highlighten als je erop klikt.

Dreamweaver doet wel iets met kleur maar met veel minder variatie.
When all else fails, you always have delusion.
pi_83590817
quote:
Op vrijdag 2 juli 2010 22:39 schreef Mirel het volgende:
Vanwege dit soort foutjes vind ik dat mensen met Notepad++ moeten werken en niet iets zoals Dreamweaver. Notepad gaat veel beter om met begin en eindtags door ze te kleuren, strepen tussen elkaar te trekken, en het begin en eind highlighten als je erop klikt.

Dreamweaver doet wel iets met kleur maar met veel minder variatie.
Ik denk dat ik ook maar ga overstappen naar Notepad++.
Ik heb altijd wel een klein beetje gebruik gemaakt van de GUI van Dreamweaver maar bij m'n laatste website betrapte ik mezelf erop 100% alleen met de code bezig te zijn, dus het is wel tijd voor een overstap
  vrijdag 2 juli 2010 @ 22:49:47 #249
71610 Black-Hole
Deep in my soul
pi_83591143
quote:
Op vrijdag 2 juli 2010 22:39 schreef Mirel het volgende:
Vanwege dit soort foutjes vind ik dat mensen met Notepad++ moeten werken en niet iets zoals Dreamweaver. Notepad gaat veel beter om met begin en eindtags door ze te kleuren, strepen tussen elkaar te trekken, en het begin en eind highlighten als je erop klikt.

Dreamweaver doet wel iets met kleur maar met veel minder variatie.
Zelf gebruik ik Coda (en had de code nog niet laten valideren)
  vrijdag 2 juli 2010 @ 23:54:01 #250
87680 Mirel
Mirel wil een bongophone.
pi_83594478
edit
When all else fails, you always have delusion.
  dinsdag 6 juli 2010 @ 13:54:05 #251
37634 wobbel
Da WoBBeL King
pi_83720632
Ik denk dat deze in CSS hoort

Hieronder een gedeelte van mijn layout:



Nu dient het volgende probleem zich aan, zodra ik de pagina oproep met een anchor #specificaties oid dan verspringt de hele boel in Firefox en IE8...



Dat gaat dus niet goed...bekend probleem?

Voorbeeld kun je hier vinden: http://v3.progenion.nl/sh(...)iltert-tot-25m2.html
Als je klikt op specificaties zie je het in IE8 en FF3 gebeuren.
Hosted VoIP SIP trunks Vast mobiel VoIP
pi_83721520
In progenion.css staat:
1<!-- slide menu -->

Da's geen correcte css comment, dus een verbeterpunt.

En je html lijkt ook niet helemaal in orde te zijn. Er gaat iets mis met de nesting van de tags en/of er ontbreken sluit-tags. Best kans dat je daarmee het probleem al kunt oplossen.
fokstok.nl
pi_84184403
hallooo!
ik heb een website gemaakt en ben al heel lang bezig om hem gecentreerd te krijgen, maar wat ik ook probeer het lukt niet en ik kan de fout niet ontdekken... Ik hoopte dat er hier iemand is die mij kan helpen om hem gewoon gecentreerd te krijgen. Bij voorbaat dank _O_

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		<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>HorseVisual.nl Paardenfotografie & Foto-art</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="opmaak2.css" rel="stylesheet" type="text/css">
<meta name="description" content="Website Horsevisual.nl" />
</head>

<body>
   
<!-- Site--> 
<img src="boven.png">
  
<!-- Menu--> 
<div class="menu">
<ul id="navbar">
  <li class="topitem"><a href="index.htm" class="active">HOME</a></li>
 <li class="topitem"><a href="nieuws.htm" class="menuitems">NIEUWS</a></li>
<li class="topitem"><a href="biografie.htm" class="menuitems">BIOGRAFIE</a></li>
<li class="topitem"><a href="partners.htm" class="menuitems">PARTNERS</a></li>
 <li class="topitem"><a href="agenda.htm" class="menuitems">AGENDA</a></li>

  <li class="topitem"><a href="referenties.htm" class="menuitems">REFERENTIES</a></li>
 <li class="topitem"><a href="contact.htm" class="menuitems">CONTACT</a></li>

</ul>
</div>

<!-- Hoofdtekst-->
<div class="hoofd"><div class="hoofdtekst"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui.

Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc, quis gravida magna mi a libero. Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras ultricies mi eu turpis hendrerit fringilla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi consectetuer lacinia.

Nam pretium turpis et arcu. Duis arcu tortor, suscipit eget, imperdiet nec, imperdiet iaculis, ipsum. Sed aliquam ultrices mauris. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Praes Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui.

Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc, quis gravida magna mi a libero. Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras ultricies mi eu turpis hendrerit fringilla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi consectetuer lacinia.

Nam pretium turpis et arcu. Duis arcu tortor, suscipit eget, imperdiet nec, imperdiet iaculis, ipsum. Sed aliquam ultrices mauris. Integer ante arcu, accumsan a, consectetuer eget, posuere ut, mauris. Praes</div> </div>

<!-- Ondertekst-->
<div class="footer"><img src="onder.png">

</div>

</div>
</body></html>


De 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
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113		@charset "utf-8";
/* CSS Document */

body {
   margin:0px;
   background-color:#666;
   background-image:url(background.jpg);
   color: white;
   font-family: Verdana, Geneva, sans-serif;
   font-size: 11px;
   
}

.hoofd
{
   
   background:url(midden.png) repeat-y;
   margin-right: 0px;
   min-height: 700px;
   color:#FFF;
}

.hoofdtekst
{
   margin-right: 0px;
   color:#FFF;
   font-family:Tahoma, Geneva, sans-serif;
   margin-left: 115px;
   width: 770px;
   padding-top: 30px;
}

   .menu {
   position: absolute;
   top: 138px;
   left: 111px;
   width: 818px;
   font-weight: normal;
   height: 31px;
   }

   
/* menu */
.menuitems {
   color: #FFF;
   text-decoration: none;
}

   
.unnamed1 {
   text-decoration: underline;
}

body{
  padding: 0;
  margin: 0;
}
 
/* style unordered list */
 
ul{
  padding: 0;
  margin: 0;
  list-style: none;
}
 
/* style menu items */
 
li.topitem{
   float: left;
   position: relative;
   width: 86px;
   padding: 15px;
   font:10px Verdana, Arial, Helvetica, sans-serif;
   color:#FFF;
   font-weight: 300;
}

li > ul{
  top: auto;
  left: auto;
}

li a:hover {
  color: #999999;
}
 
/* display drop-down menu (add an 'over' class attribute to list items for IE */
 
li:hover ul,li.over ul{
  display: block; 
}
 
#navbar li li a {
  font: normal 13px Verdana, Arial, Helvetica, sans-serif;
  color: #010E1E;
  padding: 2px;
  text-decoration: none;
}


#nav li:hover ul, #nav li.over ul { /* lists nested under hovered list items */
   display: block;   
} 
 
#navbar li li a:hover {
  color:#999999;
}

.active {
   COLOR: #999999;
   text-decoration: none;
}
pi_84184662
quote:
Op zaterdag 17 juli 2010 23:26 schreef Sabyo het volgende:
hallooo!
ik heb een website gemaakt en ben al heel lang bezig om hem gecentreerd te krijgen, maar wat ik ook probeer het lukt niet en ik kan de fout niet ontdekken... Ik hoopte dat er hier iemand is die mij kan helpen om hem gewoon gecentreerd te krijgen. Bij voorbaat dank

De html;
[ code verwijderd ]

De css;
[ code verwijderd ]
www.w3schools.com
Ga eerst eens proberen te begrijpen wat je in hemelsnaam aan het doen bent.

Ik kan je het antwoord wel geven, maar ik denk eerlijk gezegd niet dat het je dan wel lukt:
1margin: 0 auto; 
zcflevo.nl
pi_84184673
Als je nou gewoon die boel even ergen online zet zodat ik er naar kan kijken.... Volgens mij moet je er gewoon een container omheen gooien met een width en een margin:0 auto; en klaar ben je...
Nee.
  zondag 18 juli 2010 @ 00:27:48 #256
87680 Mirel
Mirel wil een bongophone.
pi_84186556
Maak een div om alle divs heen. Geef die div margin 0 auto. Zo'n allesomvattende div noem je een container.
When all else fails, you always have delusion.
pi_84422777
Mijn main-div komt +- 10-20 px onder mijn browserbalk te staan (zie frontpage.girlzfora.nl) en ik wil dat niet. Hij moet gelijk helemaal vanaf boven perfect aansluiten O+ weet iemand welk regeltje ik in mijn div moet invoegen om dat voor elkaar te krijgen? :)
pi_84422827
overflow:hidden

Dan collapst'ie met de margin van je H1 (of ander element met default margin)
zcflevo.nl
pi_84422963
Het stukje is al wel verkleind maar nog niet helemaal weg? :X ;(
pi_84423115
1
2
3
4		html, body {
margin: 0;
padding: 0;
}


Of bedoel je die niet?
fokstok.nl
pi_84423447
1
2
3
4
5
6
7
8		#main
{
overflow: hidden;
margin: 0px auto;
height: 1500px;
width: 1000px;
background-color: #fddada;
} 


Dit is mijn div.
pi_84423975
't gaat vooral om wat er omheen staat.
Heb je geen linkje naar een online voorbeeld/testcase?
zcflevo.nl
pi_84424106
quote:
Op zaterdag 24 juli 2010 01:12 schreef KomtTijd... het volgende:
't gaat vooral om wat er omheen staat.
Heb je geen linkje naar een online voorbeeld/testcase?


frontpage.girlzfora.nl/
pi_84424117
quote:
Op zaterdag 24 juli 2010 00:54 schreef Puala het volgende:

[ code verwijderd ]

Dit is mijn div.
html en body krijgen standaard een margin en/of padding mee, dat zie je terug in de pagina's
fokstok.nl
pi_84424148
Gaat het om dat roze balkje?

overflow:hidden op je #header.
zcflevo.nl
pi_84424189
Waarom staan er in hemelsnaam twee stylesheet in de body
zcflevo.nl
pi_84424400
quote:
Op zaterdag 24 juli 2010 01:20 schreef KomtTijd... het volgende:
Waarom staan er in hemelsnaam twee stylesheet in de body
Hmm... ik zie er nog veel meer....
Er wordt ook iedere keer dezelfde stylesheet ingeladen, lijkt het. Niet echt nuttig.
fokstok.nl
pi_84424768
oh shitjes, die staan er nog in. Ga zo eventjes aanpassen en dan slapen :@
  zaterdag 24 juli 2010 @ 13:12:14 #269
27454 InTrePidIvity
Looks like it's broken...
pi_84433352
1<input name="add-to-cart-button" class="add-to-cart-button" type="submit" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')">


1
2
3
4
5
6
7
8
9
10		input.add-to-cart-button { 
    width:115px; 
    height:35px; 
    background: transparant url(../images/button_add_to_cart.png) no-repeat;
    outline:none;
    border:none;
    }
input.add-to-cart-button:hover {
    background:transparant url(../images/button_add_to_cart.png) no-repeat 0 -37px;
    }


Waarom lukt dit me niet? :(

Ik krijg gewoon een standaard 'Verzenden'-button, terwijl ik dus dat PNG-bestand wil gebruiken. Er gaat vast iets fout bij de HTML, maar ik snap er weinig van :P
...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake
pi_84434529
Ik wil graag reacties toevoegen aan mijn blog maar weet niet precies waar. Ik heb deze code (weet ook niet of die juist is, ergens vandaan geplukt):

1<span class='reaction-buttons'> <b:if cond='data:top.showReactions'> <table border='0' cellpadding='0' width='100%'><tr> <td valign='center'><span class='reactions-label'> <data:top.reactionsLabel/></span> </td> <td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td> </tr></table> </b:if> </span>


En dat moet waarschijnlijk hier ergens tussen:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16		<div id="box">
<Blogger>
<div class="title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
<div class="date"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> @ <$BlogItemDateTime$></div>
<$BlogItemBody$><br>
</Blogger>
</div></div>

<div id="entries" style="display:none">           
<Blogger>
<div class="title"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
<div class="date"><BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> @ <$BlogItemDateTime$></div>
<$BlogItemBody$><br>
</Blogger>
</div></td>
</div>


Maar waar weet ik niet precies, het werkt iig niet. Weet iemand dat?
pi_84434773
quote:
Op zaterdag 24 juli 2010 13:12 schreef InTrePidIvity het volgende:

[ code verwijderd ]

[ code verwijderd ]

Waarom lukt dit me niet? :(

Ik krijg gewoon een standaard 'Verzenden'-button, terwijl ik dus dat PNG-bestand wil gebruiken. Er gaat vast iets fout bij de HTML, maar ik snap er weinig van :P
Met <input type="submit" maak je een standaard verzenden-button. En dan kun je geen (achtergrond)plaatjes gebruiken.
Met <input type="image"> maak je ook een verzend-button, maar dan kun je wel een plaatje opgeven (en je krijgt geen tekst enzo). Bij een :hover het plaatje veranderen, kan wel eens lastig zijn.

Eigenlijk zijn die input-dingen dus gewoon ondingen. ;)
fokstok.nl
  zaterdag 24 juli 2010 @ 14:16:52 #272
27454 InTrePidIvity
Looks like it's broken...
pi_84435045
quote:
Op zaterdag 24 juli 2010 14:05 schreef Light het volgende:

[..]

Met <input type="submit" maak je een standaard verzenden-button. En dan kun je geen (achtergrond)plaatjes gebruiken.
Met <input type="image"> maak je ook een verzend-button, maar dan kun je wel een plaatje opgeven (en je krijgt geen tekst enzo). Bij een :hover het plaatje veranderen, kan wel eens lastig zijn.

Eigenlijk zijn die input-dingen dus gewoon ondingen. ;)

Ik heb uiteindelijk 'transparant' weggehaald uit de CSS en value="" toegevoegd aan de HTML, dat werkt ook! Bedankt in elk geval :)
...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake
pi_84435584
quote:
Op zaterdag 24 juli 2010 14:16 schreef InTrePidIvity het volgende:

[..]

Ik heb uiteindelijk 'transparant' weggehaald uit de CSS en value="" toegevoegd aan de HTML, dat werkt ook! Bedankt in elk geval :)
Ah, volgens mij had ik het op die manier nog niet geprobeerd :)
fokstok.nl
  zaterdag 24 juli 2010 @ 15:00:12 #274
27454 InTrePidIvity
Looks like it's broken...
pi_84436352
quote:
Op zaterdag 24 juli 2010 14:34 schreef Light het volgende:

[..]

Ah, volgens mij had ik het op die manier nog niet geprobeerd :)

Ik snap alleen niet waarom ik geen handje krijg, i.p.v. de normale pointer. Is dat omdat het geen link is maar een submit-eigenschap heeft?
...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake
pi_84437488
quote:
Op zaterdag 24 juli 2010 15:00 schreef InTrePidIvity het volgende:

[..]

Ik snap alleen niet waarom ik geen handje krijg, i.p.v. de normale pointer. Is dat omdat het geen link is maar een submit-eigenschap heeft?
Yep, 't is echt iets voor een link. Standaard dan. Met css kan veel :)

1cursor: pointer;
fokstok.nl
pi_84472593
quote:
Op zaterdag 24 juli 2010 01:28 schreef Light het volgende:

[..]

Hmm... ik zie er nog veel meer....
Er wordt ook iedere keer dezelfde stylesheet ingeladen, lijkt het. Niet echt nuttig.
Dezelfde style sheet wordt nu niet meer elke keer ingeladen. Wat zie je nog meer? Heb het op school zo geleerd, dus vandaar dat ik waarschijnlijk dingen wat anders opbouw als normaal.. Maar wil het graag leren *O*
pi_84474129
quote:
Op zondag 25 juli 2010 17:22 schreef Puala het volgende:

[..]

Dezelfde style sheet wordt nu niet meer elke keer ingeladen. Wat zie je nog meer? Heb het op school zo geleerd, dus vandaar dat ik waarschijnlijk dingen wat anders opbouw als normaal.. Maar wil het graag leren *O*
Je moet het volgende nog toevoegen aan je css, om te zorgen dat de grijze rand bovenaan verdwijnt.
1
2
3
4		html, body {
margin: 0;
padding: 0;
}
fokstok.nl
pi_84474256
quote:
Op zondag 25 juli 2010 18:06 schreef Light het volgende:

[..]

Je moet het volgende nog toevoegen aan je css, om te zorgen dat de grijze rand bovenaan verdwijnt.
[ code verwijderd ]


_O_ die ga ik onthouden
pi_84538316


[ Bericht 100% gewijzigd door MrNiles op 27-07-2010 10:33:52 ]
  donderdag 29 juli 2010 @ 17:24:56 #280
27454 InTrePidIvity
Looks like it's broken...
pi_84634084
Onderstaande HTML moet een rijtje van max. 5 nieuwe artikelen tonen, gescheiden door een border-right. Hoe zorg ik ervoor dat de laatste kolom die eigenschap niet krijgt?

1
2
3
4
5
6
7
8
9
10
11
12
13
14		        <td>
            <div>
                <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->htmlEscape($_product->getName()) ?>"><img class="product-image" src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(90, 90) ?>" width="90" height="90" alt="<?php echo $this->htmlEscape($_product->getName()) ?>" /></a>
            </div>
                <p><a class="product-name" href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->htmlEscape($_product->getName()) ?>)"><?php echo $this->htmlEscape($_product->getName()) ?></a></p>
                <?php echo $this->getReviewsSummaryHtml($_product, 'short') ?>
                <?php echo $this->getPriceHtml($_product, true, '-new') ?>
                <?php if($_product->isSaleable()): ?>
                <input class="add-to-cart-button" type="submit" value="" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product) ?>')">
                <?php else: ?>
                <div class="out-of-stock"><?php echo $this->__('Tijdelijk niet verkrijgbaar') ?></div>
                <?php endif; ?>
                <div class="clear"></div>
        </td>
Ik moet in de CSS ergens iets doen met een class, maar welke?
...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake
pi_84634473
1
2
3		tr td:last-child {
border-right:0;
}
Zou volgens mij moeten werken in moderne browsers. Eventueel kun je voor oudere browsers nog een class .last aanmaken en die via JS of in je PHP-code op de laatste TD per TR leggen.
Nee.
pi_84638336
quote:
Op donderdag 29 juli 2010 17:24 schreef InTrePidIvity het volgende:
Onderstaande HTML moet een rijtje van max. 5 nieuwe artikelen tonen, gescheiden door een border-right. Hoe zorg ik ervoor dat de laatste kolom die eigenschap niet krijgt?
[ code verwijderd ]

Ik moet in de CSS ergens iets doen met een class, maar welke?
border-left gebruiken :) Behalve voor de eerste td:
1
2
3		tr td:first-child {
border-left: 0;
} 
Het effect is hetzelfde als bij border-right, maar :first-child wordt door meer browsers ondersteund.

Overigens vind ik dat je geen tabel moet gebruiken als je (een lijstje van) vijf nieuwe artikelen wilt weergeven. Maar de benadering zou hetzelfde zijn.
fokstok.nl
  vrijdag 30 juli 2010 @ 14:50:54 #283
27454 InTrePidIvity
Looks like it's broken...
pi_84667457
quote:
Op donderdag 29 juli 2010 17:37 schreef PimD het volgende:

[ code verwijderd ]

Zou volgens mij moeten werken in moderne browsers. Eventueel kun je voor oudere browsers nog een class .last aanmaken en die via JS of in je PHP-code op de laatste TD per TR leggen.
quote:
Op donderdag 29 juli 2010 19:35 schreef Light het volgende:

[..]

border-left gebruiken :) Behalve voor de eerste td:
[ code verwijderd ]

Het effect is hetzelfde als bij border-right, maar :first-child wordt door meer browsers ondersteund.

Overigens vind ik dat je geen tabel moet gebruiken als je (een lijstje van) vijf nieuwe artikelen wilt weergeven. Maar de benadering zou hetzelfde zijn.
Bedankt voor de tips, moet er nog even induiken! CSS gaat me nog niet zo makkelijk af als ik gehoopt had ;(

Hieronder een schets van m'n lay-out, waar het met name gaat om de drop-shadow aan weerskanten van de content. Hoe krijg ik dit het beste voor elkaar? Ik heb met CSS de algehele pagina al een background met gradient meegegeven, en het zelfde geldt voor het gedeelte waar 'Body' staat (1px breed, repeat-x enzo). Maar volgens mij moet ik background vervolgens ook gebruiken voor de schaduw. Houdt dit in dat ik één kolombreed plaatje moet maken met de schaduwen daarin verwerkt, of is er een andere oplossing?

...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake
pi_84671559
Box-shadow gebruiken, pech voor mensen die IE gebruiken.
Nee.
  vrijdag 30 juli 2010 @ 17:42:58 #285
27454 InTrePidIvity
Looks like it's broken...
pi_84673925
quote:
Op vrijdag 30 juli 2010 16:33 schreef PimD het volgende:
Box-shadow gebruiken, pech voor mensen die IE gebruiken.
Ja, da's net te makkelijk he :P Net als afgeronde hoeken :(
...it's rielie broken... It's rielie, rielie broken... Let's go wecycle!
[Tournament] Beste Remake
pi_84679245
Dan gebruik je een vies filter voor IE om die schaduw er onder te krijgen.
Nee.
pi_84804916
-Edit-

Probleem opgelost *O*
pi_84812110
Er zitten hier ook ICT'ers toch?

Als ik de website van mijn band open met firefox (mijn standaardbrowser) ziet alles er goed uit, geen blauwe lijnen om de afbeeldingen heen als links en alles netjes gecentreerd. Open ik hem met IE dan is de reactie echt WTF tekst loopt overal doorheen, niks staat netjes onder elkaar en de afbeeldingen worden met blauwe lijnen omgeven. :N |:(
  dinsdag 3 augustus 2010 @ 14:26:14 #289
25889 Sitethief
Fulltime Flapdrol
pi_84812218
quote:
Op dinsdag 3 augustus 2010 14:23 schreef Gitaarmat het volgende:
Er zitten hier ook ICT'ers toch?

Als ik de website van mijn band open met firefox (mijn standaardbrowser) ziet alles er goed uit, geen blauwe lijnen om de afbeeldingen heen als links en alles netjes gecentreerd. Open ik hem met IE dan is de reactie echt WTF tekst loopt overal doorheen, niks staat netjes onder elkaar en de afbeeldingen worden met blauwe lijnen omgeven. :N |:(
Welkom in de wondere wereld van het inconsistent implementeren van standaarden.........
Stroek: Sitethief, die is heel groot en sterk :Y.
Faat: *zucht* zoals gewoonlijk hoor Sitethief weer in de bocht &gt;:)
pi_84813039
:?
  dinsdag 3 augustus 2010 @ 18:51:55 #291
134533 donroyco
dus niet Donroyco
pi_84822604
quote:
Op dinsdag 3 augustus 2010 14:47 schreef Gitaarmat het volgende:
:?
Maw: IE en Firefox zijn appels en peren.
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
  dinsdag 3 augustus 2010 @ 18:52:24 #292
254493 Trollface.
gr rob fruithof, groningencity
pi_84822624
Geen IE gebruiken.
★5731U★ Death from above '79★You're a woman, i'm a machinielsie ★ ✠ ★ Telkens weer een beetje sterven★ I was born in a winterstorm, i live there still★
  dinsdag 3 augustus 2010 @ 18:58:05 #293
134533 donroyco
dus niet Donroyco
pi_84822817
quote:
Op dinsdag 3 augustus 2010 18:52 schreef Trollface. het volgende:
Geen IE gebruiken.
Daar kun je niet aan ontkomen.
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
  dinsdag 3 augustus 2010 @ 18:58:23 #294
87680 Mirel
Mirel wil een bongophone.
pi_84822824
Ik test altijd in Opera en dan later denk ik 'oh kut even testen in de andere browsers' en dan is het nog steeds goed
When all else fails, you always have delusion.
  dinsdag 3 augustus 2010 @ 18:58:33 #295
254493 Trollface.
gr rob fruithof, groningencity
pi_84822831
quote:
Op dinsdag 3 augustus 2010 18:58 schreef donroyco het volgende:

[..]

Daar kun je niet aan ontkomen.
Hoezo niet?

Edit: oh, ik dacht dat hij als gebruiker problemen had, niet als bouwer.
★5731U★ Death from above '79★You're a woman, i'm a machinielsie ★ ✠ ★ Telkens weer een beetje sterven★ I was born in a winterstorm, i live there still★
  dinsdag 3 augustus 2010 @ 18:59:40 #296
134533 donroyco
dus niet Donroyco
pi_84822859
quote:
Op dinsdag 3 augustus 2010 18:58 schreef Trollface. het volgende:

[..]

Hoezo niet?

Edit: oh, ik dacht dat hij als gebruiker problemen had, niet als bouwer.
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
  dinsdag 3 augustus 2010 @ 20:22:41 #297
71610 Black-Hole
Deep in my soul
pi_84826093
quote:
Op dinsdag 3 augustus 2010 14:23 schreef Gitaarmat het volgende:
Er zitten hier ook ICT'ers toch?

Als ik de website van mijn band open met firefox (mijn standaardbrowser) ziet alles er goed uit, geen blauwe lijnen om de afbeeldingen heen als links en alles netjes gecentreerd. Open ik hem met IE dan is de reactie echt WTF tekst loopt overal doorheen, niks staat netjes onder elkaar en de afbeeldingen worden met blauwe lijnen omgeven. :N |:(
Laat eens wat van je code zien, cross browser compatability is een bitch soms.
pi_84828221
Als je verder niet let op de website vind ik het best, beetje noob geprogrammeerd maar goed als ik hem open in firefox ziet het er netjes uit.

Deze.
  dinsdag 3 augustus 2010 @ 21:59:18 #299
134533 donroyco
dus niet Donroyco
pi_84830663
quote:
Op dinsdag 3 augustus 2010 21:12 schreef Gitaarmat het volgende:
Als je verder niet let op de website vind ik het best, beetje noob geprogrammeerd maar goed als ik hem open in firefox ziet het er netjes uit.

Deze.
Doe even op .nl hosten.
Op maandag 29 september 2008 11:45 schreef HostiMeister het volgende:
Dat is zeg maar de Nederlandse taal op een vuige keukentafel voorover buigen en hem dan zonder glijmiddel anaal verkrachten. :'(
pi_84830997
1<body vlink="#####" alink="#####">
Ik had dit al zoooo ver weggestopt dat ik niet eens meer wist wat het ook alweer deed :D
Nee.
actieve topics nieuwe topics
abonnement Unibet Coolblue Bitvavo
[CSS] voor dummies #14
Index

» digital corner

» development

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