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

woensdag 15 maart 2006 @ 20:43:11 #251

DutchBlood

Ik heb een div, die een container is voor twee andere divs. Nu wil ik de achtergrond van het geheel zwart krijgen. In IE werkt het als ik de container zwart maak, maar in Firefox gebeurd er niks. Ik definineer de achtergrond van de twee andere div's dus niet.

woensdag 15 maart 2006 @ 21:54:24 #252

SuperRembo

Sinds 1998

Ik gok dat je de divs in de container een float of position absolute hebt gegeven. Dan zitten er dus geen elementen meer in de container die de hoogte bepalen, de hoogte wordt dus 0. Dat kan je ook zien als je er een border op zet (of met de DOM inspector natuurlijk).
Als je floats hebt gebruikt dan zal je een element met clear:both moeten toevoegen.

woensdag 15 maart 2006 @ 22:22:15 #253

Chandler

Sr, weet jij misschien een site die een soortement van windows achtige CSS style layout? dat lijkt op windows schermen oid? maar dan zonder images?

weet dat het een pittige vraag is

Just say hi!

woensdag 15 maart 2006 @ 22:24:13 #254

qu63

..de tijd drinkt..

quote:
Op woensdag 15 maart 2006 22:22 schreef Chandler het volgende:
Sr, weet jij misschien een site die een soortement van windows achtige CSS style layout? dat lijkt op windows schermen oid? maar dan zonder images? weet dat het een pittige vraag is

http://desktop.trovster.com/desktop/ zoiets?

It's Time To Shine
[i]What would life be like without rhethorical questions?[/i]

donderdag 16 maart 2006 @ 06:13:24 #255

ChOas

** Warning: Choking hazard **

quote:
Op woensdag 15 maart 2006 22:22 schreef Chandler het volgende:
Sr, weet jij misschien een site die een soortement van windows achtige CSS style layout? dat lijkt op windows schermen oid? maar dan zonder images? weet dat het een pittige vraag is

OS X beginnetje : http://choas.smdc-network.org/test

Niet gemaakt voor IE

"I contend that we are both atheists. I just believe in one fewer god than you do.
When you understand why you dismiss all the other possible gods, you will understand why I dismiss yours."
[Stephen Roberts]

donderdag 16 maart 2006 @ 08:27:27 #256

Chandler

qu63 eb ChOas: ik bedoel eingelijk meer van windows schermen (meer in de zin van een applicatie)..

Just say hi!

donderdag 16 maart 2006 @ 11:22:51 #257

SuperRembo

Sinds 1998

Als je geen plaatjes wil gebruiken, dan blijven er dus alleen kleuren, borders en fonts over. Dat is vrij simpel om te maken.

donderdag 16 maart 2006 @ 12:15:07 #258

the_disheaver

quote:
Op donderdag 16 maart 2006 06:13 schreef ChOas het volgende:
Niet gemaakt voor IE

+ Opera

donderdag 16 maart 2006 @ 19:16:06 #259

Chandler

quote:
Op donderdag 16 maart 2006 11:22 schreef SuperRembo het volgende:
Als je geen plaatjes wil gebruiken, dan blijven er dus alleen kleuren, borders en fonts over. Dat is vrij simpel om te maken.

Dat zou je zeggen inderdaad, maar helaas geld dat voor mij niet

Ik wil iets hebben waarin ik mijn PHP2HEX stap voor stap kan zetten... maar goed... ik blijf zoeken.

Just say hi!

donderdag 16 maart 2006 @ 20:55:27 #260

blieblie

Ik heb een div vraagje.
Mag je niet in DIV's 1 variabele veranderen uit de stylesheet?
Ik heb:

quote:
<div id="dayoverview" align="center" style="left:30;">235px<hr></div>

En in de stylesheet staat

quote:
#dayoverview
{
position:absolute;
top:160px;
width:200px;
z-index:5;
background-color: #EEEEEE;
}

De reden waarom ik de "left" apart heb staan is omdat ik em elke keer met 205 pixels op wil hogen.
Helaas gebeurd er niets in FF en IE

. In de bron staat het goed, maar in de browser zelf gebeurd er niets.

Audioscrobbler _O_
Poezel

donderdag 16 maart 2006 @ 21:08:27 #261

SuperRembo

Sinds 1998

Maak er eens "left:30px" van.

(Pas trouwens ook ff je usericon aan zodat ie echt 60x60px is. 72kb is een beetje veel voor 1 zo'n plaatje. Wel een mooie kat

)

[ Bericht 79% gewijzigd door SuperRembo op 16-03-2006 21:19:56 ]

donderdag 16 maart 2006 @ 23:06:02 #262

Litso

Interlectueel.

Mensen, ik heb een CSS probleempje.

Ik heb een pagina met daarop een vlak waar tekst komt te staan. Dit is een div met achtergrondkleur, en daarbinnen wil ik per alinea tekst een aparte div. Om en om komt er in elke alinea ofwel links ofwel rechts een plaatje te staan, die de betreffende kant op float.

Het probleem is alleen dat als de eerste alinea een plaatje heeft dat naar links float en de alinea niet helemaal tot onderaan het plaatje komt, de tweede alinea omhoog kruipt en ook al tegen het plaatje aan gaat zitten, ookal zijn het twee verschillende div's.

(voor als het niet duidelijk is, hier is het te zien: http://litso.com/school/geo/nieuw/h1_par2.htm )

De structuur is dus:

1
2
3
4
5
6
7
8
9
10
11

<div waar alle alinea's inkomen>
  <h1> (Titel)</h1>
  <div voor de eerste alinea>
      <plaatje dat naar links float>
      <p (eerste alinea)>tekst</p>
  </div>
  <div voor de tweede alinea>
      <plaatje dat naar rechts float>
      <p (tweede alinea)>tekst</p>
   </div>
</div>

En het ziet er zo uit:

1
2
3
4
5
6
7
8
9

[ Bericht 10% gewijzigd door Litso op 16-03-2006 23:15:06 ]

"Dat is echt ontzettend zielig" ©

vrijdag 17 maart 2006 @ 01:21:02 #263

Litso

Interlectueel.

Niemand?

"Dat is echt ontzettend zielig" ©

vrijdag 17 maart 2006 @ 04:40:06 #264

blieblie

quote:
Op donderdag 16 maart 2006 21:08 schreef SuperRembo het volgende:
Maak er eens "left:30px" van.

(Pas trouwens ook ff je usericon aan zodat ie echt 60x60px is. 72kb is een beetje veel voor 1 zo'n plaatje. Wel een mooie kat )

Oei

, en daar gewoon consistent overheen kijken

.

Audioscrobbler _O_
Poezel

vrijdag 17 maart 2006 @ 08:41:24 #265

SuperRembo

Sinds 1998

quote:
Op donderdag 16 maart 2006 23:06 schreef Litso het volgende:
Mensen, ik heb een CSS probleempje.
[...]

clear:both op de titel?

En wees geduldig

vrijdag 17 maart 2006 @ 09:21:59 #266

Litso

Interlectueel.

quote:
Op vrijdag 17 maart 2006 08:41 schreef SuperRembo het volgende:

[..]

clear:both op de titel?

En wees geduldig

Nee, helaas

Wat moet het doen dan?

"Dat is echt ontzettend zielig" ©

vrijdag 17 maart 2006 @ 10:21:09 #267

SuperRembo

Sinds 1998

Zo dus:
#textvak h2 { clear:both; }
Dat werkt.

In Firefox staan de afgeronde hoeken trouwens verkeerd.

vrijdag 17 maart 2006 @ 11:14:34 #268

mschol

quote:
Op dinsdag 14 maart 2006 11:52 schreef Roönaän het volgende:
style="width:100px;"

-r-

als ik dat doe staan me drop down lijstjes idd goed..
maar de <input type=text> velden die overlappen aan de rechterkant de border

ik kan een cell padding gebruiken of me wdth in die 2 kolommen naar 98% ziet er ook ok uit

dit probleem is trouwens in IE en FF zo ..

volgend vraagje:
ik heb een tabel met border, alleen ik krijg het niet voor elkaar om er een enkele lijn van te maken die ik een kleurtje geef
als ik namelijk border="1px" doe zie ik alsnog 2 lijnen :|
kan het wat ik wil of is dat gewoon niet mogelijk?

[ Bericht 23% gewijzigd door mschol op 17-03-2006 11:25:14 ]

vrijdag 17 maart 2006 @ 11:15:48 #269

Litso

Interlectueel.

quote:
Op vrijdag 17 maart 2006 10:21 schreef SuperRembo het volgende:
Zo dus:
#textvak h2 { clear:both; }
Dat werkt.

In Firefox staan de afgeronde hoeken trouwens verkeerd.

Die hoekjes werk ik nog aan idd

Ik zal het nog even proberen.

vrijdag 17 maart 2006 @ 11:24:17 #270

Litso

Interlectueel.

Geweldig, bedankt

vrijdag 17 maart 2006 @ 11:46:23 #271

wonko

Fap

Ik heb een menu

1
2
3
4
5
6
7
8
9

<div id="menu">
      <a class="rollmenu" href="index.html">Home</a>
        <a class="rollmenu" onmouseover="slidemenu.showMenu('menu1');" onmouseout="slidemenu.hideMenu('menu1');">Exterieur</a><br>
        <a class="rollmenu" onmouseover="slidemenu.showMenu('menu2');" onmouseout="slidemenu.hideMenu('menu2');">Interieur</a><br>
        <a class="rollmenu" onmouseover="slidemenu.showMenu('menu3');" onmouseout="slidemenu.hideMenu('menu3');">Hekwerkonderdelen</a><br>
       <a class="rollmenu" onmouseover="slidemenu.showMenu('menu4');" onmouseout="slidemenu.hideMenu('menu4');">Tuindecoratie</a><br>
         <a class="rollmenu" href="toeleveren.html">Toeleveren</a>
         <a class="rollmenu" href="contact.html">Contact</a>
     </div>

Met als menu:

1	#menu { margin: 0; padding: 0; width: 130px; float: left; clear: both; vertical-align: top }

En menu items:

1
2

a:link.rollmenu, a:visited.rollmenu { color: #eee; font-size: 10pt; font-family: Verdana, Arial, Georgia, Times; font-weight: normal; text-decoration: none; background-color: #298ca5; letter-spacing: -1px; display: block; padding: 4px; width: 130px; height: 22px; border: outset 1px #fff }
a:hover.rollmenu, a:active.rollmenu { color: #fbfdb5; font-size: 10pt; font-family: Verdana, Arial, Georgia, Times; font-weight: normal; text-decoration: none; background-color: #4ab5d6; letter-spacing: -1px; display: block; padding: 4px; width: 130px; height: 22px; border: solid 1px }

Ik krijg de menu items niet tegen elkaar aan onder elkaar. De eerste twee wel maar die met een mouseout of over houden een grote afstand onderling. Iemand een idee?

Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.

zaterdag 18 maart 2006 @ 17:54:41 #272

Castor

Obey the rules, miss the fun

Beetje vreemd menu... waarom geen unordered list?

Maar goed, is dit wat je bedoeld?
Zet "href" in je <a> en verwijder de <br> achter je <a>

1
2
3
4
5
6
7
8
9

<div id="menu">
      <a class="rollmenu" href="index.html">Home</a>
        <a href="#" class="rollmenu" onmouseover="slidemenu.showMenu('menu1');" onmouseout="slidemenu.hideMenu('menu1');">Exterieur</a>
        <a href="#" class="rollmenu" onmouseover="slidemenu.showMenu('menu2');" onmouseout="slidemenu.hideMenu('menu2');">Interieur</a>
        <a href="#" class="rollmenu" onmouseover="slidemenu.showMenu('menu3');" onmouseout="slidemenu.hideMenu('menu3');">Hekwerkonderdelen</a>
   <a href="#" class="rollmenu" onmouseover="slidemenu.showMenu('menu4');" onmouseout="slidemenu.hideMenu('menu4');">Tuindecoratie</a>
        <a class="rollmenu" href="toeleveren.html">Toeleveren</a>
        <a class="rollmenu" href="contact.html">Contact</a>
     </div>

Castor's Photostream op Flickr

zaterdag 18 maart 2006 @ 18:31:21 #273

wonko

Fap

quote:
Op zaterdag 18 maart 2006 17:54 schreef Castor het volgende:
Beetje vreemd menu... waarom geen unordered list?

Zover was ik nog niet. Euh...een voorbeeld of een tutorial?

quote:
Maar goed, is dit wat je bedoeld?
Zet "href" in je <a> en verwijder de <br> achter je <a>
[ code verwijderd ]

Bedankt...dat zocht ik ja.

Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.

maandag 20 maart 2006 @ 14:31:55 #274

The_Cyberspace

Ik zit ook weer met een probleempje. Ik ben een layout aan het maken via css maar dit wil niet helemaal lukken.

Hier de html en css file:
html file
css file

Het is de bedoeling dat de onderste groene balk altijd onderaan de pagina staat. Nu is het zo zodra ik em open met een resolutie van 1280x1024 hij netjes onderaan staat. Maar maak ik het scherm kleiner, 800x600 ofzo, dan staat de balk ook nog onderaan maar dan kan ik scrollen en als ik ga scrollen blijft de balk na het scrollen niet meer onderaan staan. Dit is zowel met Firefox 1.5.1 als met Internet Explorer 6.0

Iemand enig idee?

maandag 20 maart 2006 @ 15:19:41 #275

Desdinova

Olaa

in je content div een overflow:auto zetten en iets van height: 100%;

maar dat is buggy dacht ik onder browsers onderling.

wat bij mij dus weer de vraag oproept hoe je een div in elke browser gewoon de volledige hoogte krijgt?

_{wtf is er gebeurd met de layout}

As a rule, I never touch anything more sophisticated and delicate than myself.

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

[CSS] voor dummies - Deel 3

» digital corner

» digital corner