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

woensdag 20 juli 2005 @ 15:52:46 #201

Berkery

Fat bastard

Dat komt door je display: inline vermoed ik. inline elementen kan je geen vaste breedte geven, normaal gesproken.

No Dukes of Hazzard in the classroom

woensdag 20 juli 2005 @ 15:54:06 #202

Chandler

hmm maar als ik geen inline gebruik komen ze onder elkaar, natuurlijk zou ik dat kunnen oplossen met een float: left; hmm.... tnx voor de thoughts b!.

The people who lost my respect will never get a capital letter for their name again.
Like trump...

woensdag 20 juli 2005 @ 15:54:33 #203

Berkery

Fat bastard

Misschien kan je hier wat mee: http://www.alistapart.com/articles/taminglists/

No Dukes of Hazzard in the classroom

woensdag 20 juli 2005 @ 15:56:46 #204

Berkery

Fat bastard

Of dit: http://home.wanadoo.nl/b.(...)orizontaal-menu.html

No Dukes of Hazzard in the classroom

woensdag 20 juli 2005 @ 17:50:18 #205

Leshy

Held met sokken.

quote:
Op woensdag 20 juli 2005 15:52 schreef Berkery het volgende:
Dat komt door je display: inline vermoed ik. inline elementen kan je geen vaste breedte geven, normaal gesproken.

Nope, daar kun je display: inline-block; voor gebruiken, maar dat werkt in MSIE en Mozilla/Firefox alleen op items die normaal gesproken al inline items zijn

donderdag 21 juli 2005 @ 09:52:14 #206

Chandler

ik heb het dus opgelost met een float: left;

maar nu moet ik nog eens kijken hoe ik het klaar krijg met hover etc.

The people who lost my respect will never get a capital letter for their name again.
Like trump...

donderdag 21 juli 2005 @ 10:02:13 #207

Roonaan

Strictly

<div onmouseover="this.className='divhover';" onmouseout="this.className='';">

-r-

zondag 24 juli 2005 @ 23:43:24 #208

MrDoegewoon

Ik ben net begonnen met het opmaken in CSS

en heb dit:

<div id="header">
bladiebla.nl
</div>
<div id="tussen">
link 1 <> link 2 <> link 3
</div>

Nu wil ik dat tussen header en tussen een wit ruimt komt (een <br> is al te groot) hoe krijg ik dit voor elkaar (zal vast een domme vraag zijn maar goed

)

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

zondag 24 juli 2005 @ 23:57:43 #209

WalfredGeesink

De vrachtwagenchauffeur.

div#tussen { margin-top: 5px; }

walfredgeesink.nl/fm

maandag 25 juli 2005 @ 11:47:16 #210

Chandler

Mensen, ik heb google nu meerdere malen geraadpleegd voor het volgende maar kon wederom helaas geen oplossing vinden.

Stel ik heb een variabel kader die varieert van (10px/10px tot 800px/800px) en wil deze gecentreerd hebben doormiddel van css (dus zowel horizontaal als verticaal).

Hoe moet ik dit oplossen met behulp van css? iemand een suggestie?

The people who lost my respect will never get a capital letter for their name again.
Like trump...

maandag 25 juli 2005 @ 20:45:09 #211

MrDoegewoon

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

<div id="header">
   blabla.nl
  </div>
  <div id="tussen">
   <a href="./index.php">Home</a> <> <a href="./webhosting/index.php">Webhosting</a> <> link 3
   </div>

/* CSS Document */

body {
background-color:#FFFFFF;
}

#header {
background-color:#EEEEEE;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:36px;
border-width:1;
border-color:#000000;
border-style:dotted;
}

#tussen {
width:100%;
margin-top:5px;
padding:0px 0px 0px 10px;
background-color:#EEEEEE;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
border-width:1;
border-color:#000000;
border-style:solid;
}

Ik heb nu dit, ik wil dat de links van links iets meer weg staan maar nu wordt #tussen groter dan header terwijl ze beide op 75% staan. Wat doe ik fout

Is er trouwens een goede liefst Nederlandse website met tutorial hoe je een website opbouwt in css

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

maandag 25 juli 2005 @ 21:03:50 #212

SuperRembo

Sinds 1998

Wat bedoel je met "iets meer weg staan" en wat staat op 75%? (ik zie nergenes 75%)

Vervang <> door <>, anders is je html niet geldig.
Het lijkt me handiger om de font-family bij de body te zetten, dan hoef je dat niet overal te herhalen.

maandag 25 juli 2005 @ 21:07:22 #213

MrDoegewoon

quote:
Op maandag 25 juli 2005 21:03 schreef SuperRembo het volgende:
Wat bedoel je met "iets meer weg staan" en wat staat op 75%? (ik zie nergenes 75%)

Vervang <> door <>, anders is je html niet geldig.
Het lijkt me handiger om de font-family bij de body te zetten, dan hoef je dat niet overal te herhalen.

Ik bedoel breder en width

voorbeeld:
http://www.dutchfootballmanagersite.nl/jmsystems/

css file:
http://www.dutchfootballm(...)ms/css/standaard.css

Ik wil nu toch eens CSS beter gaan leren ipv steeds met tabellen werken

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

maandag 25 juli 2005 @ 21:34:03 #214

SuperRembo

Sinds 1998

Gooi je html eens door een HTML Validator en je css door een CSS Validator.

Html en css die niet volgens de regels zijn opgesteld kunnen voor onvoorspelbare resultaten leiden. Dat maakt het zoeken naar fouten in je layout erg lastig.

Validators zijn niet heilig, maar wel een goede hulp.

maandag 25 juli 2005 @ 21:51:17 #215

MrDoegewoon

Hmmz heb ze er door heen gehaald en was bij de html idd de charset vergeten en bij de css een maat vergeten op te geven bij border-width:1; maar het probleem blijft...

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

maandag 25 juli 2005 @ 22:05:25 #216

SuperRembo

Sinds 1998

Het verschil zit in de padding-left van #tussen.

maandag 25 juli 2005 @ 22:08:44 #217

MrDoegewoon

quote:
Op maandag 25 juli 2005 22:05 schreef SuperRembo het volgende:
Het verschil zit in de padding-left van #tussen.

Hmmz ik wil dus dat de tekst vanaf links iets naar binnen gaat (die 5px) maar dat houd in dat er rechts 5px bijkomt dus??

Sorry ben nog maar net bezig met CSS

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

maandag 25 juli 2005 @ 22:36:19 #218

SuperRembo

Sinds 1998

Ja.

Je kan het oplossen door om beide divs een div te zetten met width:75%. #header en #tussen geef je geen width.

Je kan het ook oplossen door er voor te zorgen dat er tussen de div#tussen en de links een extra container zit. Dat kan een div of een p zijn, maar ook een list (ul). Op die container kan je dan die extra paddin zetten.

maandag 25 juli 2005 @ 22:41:04 #219

MrDoegewoon

Jij ruled

thnx

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

donderdag 28 juli 2005 @ 17:54:23 #220

MrDoegewoon

Nu heb ik het volgende probleem:

Ik wil een header maken, daaronder een tussenbalkje en daaronder de content en daaronder weer een footer met copyright meuk.

Nu lukt de header en het tussenbalkje maar bij de content gaat het fout, er moeten daar twee gedeeltes naast elkaar komen een met een soort van menu en de andere met de tekst enzo, nu heb ik ze via een tutorial naast elkaar gekregen (float:left;) maar vallen ze uit de box die ik eromheen gemaakt hebt terwijl dit bij de header en de tussen wel goed gaat de box daarom heen wordt gewoon wel vergroot.

Zie het voorbeeld hier
CSS file hier: hier

Edit:
De gedeelte waarin de tekst moet komen is nu ook onder de menu box komen te staan (wel er naast maar niet dezelfde hoogte

)

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

donderdag 28 juli 2005 @ 18:51:53 #221

SuperRembo

Sinds 1998

Je moet de floats "clearen" om ze binnen de box te houden. Daarvoor heb je een (leeg) element nodig na de floats;

1
2
3
4
5

   <div id="content">
      Lorem ipsum dolor sit amet...
   </div>
    <div class="clear"></div>
</div>

css:

1
2
3

.clear {
clear: both;
}

Verder kan je beter de float en width weglaten voor #content.

donderdag 28 juli 2005 @ 20:52:31 #222

MrDoegewoon

Thnx staat nu goed, heb je toevallig een website of een boek dat je kan aanraden over het opmaken van een website met CSS (dus zonder tabellen enzo)

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

donderdag 28 juli 2005 @ 21:56:15 #223

SuperRembo

Sinds 1998

De referenties
http://www.w3.org/TR/CSS21/ W3C CSS
http://www.w3.org/TR/html401/ W3C HTML
http://www.mozilla.org/docs/dom/domref/ Gecko DOM Reference
http://msdn.microsoft.com(...)ce/css_ref_entry.asp MSDN CSS Reference

http://home.parse.nl/~michiel/semantiek.html Semantiek - Waarom zou je?
http://www.w3schools.com/ heeft wel handige basic tutorials
http://www.alistapart.com/ allerlei artikelen over css
http://www.quirksmode.org/ een site met veel info over bugs en eigenaardigheden van verschillende browsers.
http://www.glish.com/css/ een aantal css layouts

maandag 1 augustus 2005 @ 21:51:04 #224

MrDoegewoon

Thnx

.

Ben nu bezig om m'n eigen website van tabellen over te knallen naar CSS en lukt goed. Werkt trouwens echt veel beter dan tabellen dat CSS

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

dinsdag 2 augustus 2005 @ 17:51:46 #225

MrDoegewoon

Hmmz ik heb nu het volgende probleem, een groot gedeelte van de lay-out van m'n site is overgezet naar CSS. Maar nu gaat in Firefox de Footer direct tegen de content aan staan (terwijl er een margin-top van 10px; is ingesteld). Zet ik een border (niet hidden of none) om de content heen doe gaat ie er wel 10px vanaf, in IE werkt het wel goed overigens:

De CSS:
http://www.dutchfootballmanagersite.nl/temp/css.txt

En de HTML
http://www.dutchfootballmanagersite.nl/temp/html.txt

West Ham supporters, check: Dutchirons
Dutch Football Manager Site!
Determined to deliver, destined to dominate. - The Third Movement

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

[CSS] voor dummies - Deel 2

» digital corner

» digital corner