Bonjour je débute en css

J'ai un logo(image gif )que je positionner dans une barre d'entête:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
 
<style type="text/css">
BODY
{
    FONT-SIZE: 12px;
    MARGIN: 0px;
    FONT-FAMILY: verdana, arial, sans-serif
}
.head1
{
    WIDTH: 770px;
    HEIGHT: 91px;
    TEXT-ALIGN: left
}
.head2
{
    BACKGROUND-IMAGE: url(design/head2.gif);
    WIDTH: 770px;
    HEIGHT: 36px
}
.logo
{
    BORDER-RIGHT: 0px;
    BORDER-TOP: 0px;
    MARGIN-TOP: 3px;
    FLOAT : LEFT;
 
    BORDER-LEFT: 0px;
    MARGIN-RIGHT: 10px;
    BORDER-BOTTOM: 0px;
    TEXT-ALIGN: left
}

Pour l'instant je n'arrive que à l'aligner sur la gauche.
Ce que je voudrais faire c'est un positionnement plus fin : je voudrais
positionner mon logo à distance de la marge de gauche. Cette distance je voudrais la paramétrer.
Sur le code que je vous ai présenté : Le logo est collé à la marge gauche.

Donc Comment faire pour positionner "finement" un tel objet?