Transparency in IE en Firefox

CSS:

filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;

Geplaatst in css, firefox, ie. Leave a Comment »

Image centreren in CSS

display:block;
margin-left:auto;
margin-right:auto;

Geplaatst in css. Leave a Comment »

Ultimate layout

gebruikte technieken

- jquery-1.1.3.1.pack
plugins:
- vjustify() voor het gelijktrekken van CSS kolommen
- SaferMailTo() anti-spam voorziening
- RunOnLoad() beter werkende functie

versie geschiedenis

14-8-2007 – runOnLoad() in plaats van $(document).ready() toegevoegd.

CSS Cachebuster

Wanneer de ontwikkelserver de cache te lang vasthoud, en daardoor dus de css niet ververst, moet je verwijzing naar de stylesheet op deze manier aanpassen;

 <link rel="stylesheet" type="text/css" media="screen" href="css/screen.css?foo"/>

BACKGROUND-IMAGE verdwijnt in de HTML e-letter

De oplossing is de link naar de background image een volledig pad van te maken, dus;

background-image: url (http://...........);

Elementen willen niet FLOATen

Wanneer meerdere elementen niet naast elkaar willen floaten, moet de parent een breedte hebben!

<div width=x>  <<---belangrijk!!
   <div style="float:left;">hoi</div>
   <div style="float:left;">hoi</div>
   <div style="float:left;">hoi</div>
</div>
Geplaatst in css, html. Leave a Comment »

FORM tag breekt DIV opmaak

Als de DIVs in een opmaak niet schijnen te floaten, of niet naast elkaar lijken te passen in IE, dan komt dit door het ontbreken van de volgende tag:

form {
width: 100%;
}
Geplaatst in css, html. Leave a Comment »

CSS BORDERS en TABLE-CELLS

Als er in de css een border om een td wordt gedefineerd, dient de td te worden voorzien van inhoud, al was het maar een nonbreaking-space.

css:

td {border:1px solid black;}

html:

<table>
   <tr>
     td> </td>
   </tr>
</table>
Geplaatst in css, html. Leave a Comment »

FLOATing DIVs

Bij Float: Let op de volgorde van de DIV!

de DIV die b.v. rechts gefloat moet worden dient in de hierarchie VOOR de andere DIV te komen, ook al komt hij er visueel gezien na!

Geplaatst in css, html. Leave a Comment »

Selected state

Actieve pagina aangeven in menu via css. Dit voorkomt programmeerwerk.

css:

.about {inactive css stijl;}
.contact {inactive css stijl;}
.products {inactive css stijl;}
body#contact .contact {css stijlen;}

html:

 <body id="contact">

<ul>
  <li class"about" />
  <li class="contact" />
  <li class="products" />
</ul>
Geplaatst in css. Leave a Comment »