[CSS] voor dummies - Deel 4 | Digital Corner (DIG)

dinsdag 23 mei 2006 @ 09:03:19 #226

CraZaay

prettig gestoord

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.

maandag 29 mei 2006 @ 21:33:22 #227

Da_Koen

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

Verstuur ringtones en Foto's gratis naar je mobiel

maandag 29 mei 2006 @ 21:35:12 #228

DionysuZ

Respect my authority!

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

Berkery

Fat bastard

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 Frauenkleider, und lummel mich in Bars

maandag 29 mei 2006 @ 21:58:49 #230

Da_Koen

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

Verstuur ringtones en Foto's gratis naar je mobiel

maandag 29 mei 2006 @ 22:00:33 #231

the_disheaver

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

DionysuZ

Respect my authority!

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

maandag 29 mei 2006 @ 22:30:48 #233

the_disheaver

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

maandag 29 mei 2006 @ 23:09:12 #234

Da_Koen

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 ]

Verstuur ringtones en Foto's gratis naar je mobiel

dinsdag 30 mei 2006 @ 00:49:34 #235

Castor

Obey the rules, miss the fun

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:
1 Code verwijderd.

Een span is "display: inline" maak er "display:block" van en dan kun je er een width aan geven.

Castor's Photostream op Flickr

woensdag 31 mei 2006 @ 15:31:59 #236

Erik

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

woensdag 31 mei 2006 @ 15:39:08 #237

super-muffin

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 ]

Steam - SC2

woensdag 31 mei 2006 @ 16:04:04 #238

Erik

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.

woensdag 31 mei 2006 @ 16:14:13 #239

super-muffin

oke,doe ik ook, maar dan geef ik de border kleur mee te geven dan voor het testen, kun je makkelijk onderscheid maken

Steam - SC2

vrijdag 2 juni 2006 @ 16:51:13 #240

mrbombastic

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

CraZaay

prettig gestoord

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

woensdag 7 juni 2006 @ 15:58:24 #242

Erik

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

HenkBenzinetank

Toegevoegde waarde

zoek even op faux-columns

donderdag 8 juni 2006 @ 01:19:50 #244

super-muffin

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

1	margin: 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>

Steam - SC2

dinsdag 13 juni 2006 @ 17:06:01 #245

Hunchy

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

CraZaay

prettig gestoord

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

Fred

Beroepschagrijn

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

vrijdag 16 juni 2006 @ 18:17:58 #248

SuperRembo

Sinds 1998

Haal eerst eens al die <font> <center> bgcolor="" en border="" zooi weg anders wordt het nooit wat.

vrijdag 16 juni 2006 @ 18:27:50 #249

CraZaay

prettig gestoord

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

Fred

Beroepschagrijn

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

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

[CSS] voor dummies - Deel 4

» digital corner

» digital corner