28172 sujets

CSS et mise en forme, CSS3

[Résolu] Problem de positionement

Bonjour ,
Je suis en train de creer un site web , ms impossible de bien aligner mes divs pour ke ca rende bien . je vous donne mon code si vous pouviez y jeter un oeuil ...

mon prob se situe a ma div ''ligne2'' , impossible de faire afficher les div ki sont a l interieurs.... div "p" et div "s".

mon code html :


<!DOCTYPE HTML>
<html>
    <head>
<link rel="stylesheet" type="text/css" href="css2.css">
</head>
<body>
            <div id="body2">
              
                   <div id=header>
                         <div id=header1>
                                <div id="log"><img src="media/logo.png"   alt="log">
                         </div>
                        
                         <div id="nav">
                            <div id="home"></div>
                            <div id="mais"></div>
                            <div id="cap"></div>
                            <div id="priv"></div>
                            <div id="art"></div>
                            <div id="cont"></div>
                         </div>      
         
                   </div>
                  
              
             <div id="rap">
                    
                    <div id="rap2"> 
                        
                        <div id="ligne1">
                             <div  id="degre">  </div>
                             <div  id="kim">  </div>
                        </div>
                        
                        <div id="ligne2">
                               <div  id="p">  </div>
                             <div  id="s">  </div>
                        </div>
                                          
                         
                         
                    </div> 
                  
                  
                   <div id="shit"></div> 
              </div>        


 

<div id="footer">
 <div id="bottom"></div>
 <div id="bottom2"></div>
 </div>
</body>
</html>



Mon css:

body{

margin: 0px auto;
padding: 0px;
}
#header{



}

#log{
width:362px;
height: 136px;

margin: 0 auto;

}
#body2{


margin: 0 auto;
padding: 0px;

}

#header{
height: 180px;
background: url("media/background.jpg");

}
#header1{
width:973px;
height: 100%;

margin: 0 auto;
padding: 0px;
}

#rap{

background:url("media/back.jpg") ;
margin: 0 auto;
padding: 0px;

background-repeat: repeat-y;
border: blue 2px dotted;


}

#rap2{
width:973px;
height: 2000px;
margin: 0 auto;
padding: 0px;
border: 2px fuchsia dotted;
}

#nav{
height: 42px;
width: 900px;
margin-top: 2px;

}

#home{
height: 42px;
width: 72px;
background-image: url(media/home.png) ;
float: left;
background-repeat: no-repeat;
}

#home:hover{

background-image: url(media/homebis.png) ;
background-repeat: no-repeat;

}


#mais{
height: 42px;
width: 195px;
background-image: url(media/seed.png);
float: left;
background-repeat: no-repeat;

}

#mais:hover{

background-image: url(media/seedbis.png) ;
background-repeat: no-repeat;

}

#cap{
height: 42px;
width: 147px;
background-image: url(media/vc.png);
float: left;

}

#cap:hover{

background-image: url(media/vcbis.png) ;
background-repeat: no-repeat;

}


#priv{
height: 42px;
width: 129px;
background-image: url(media/pe.png) ;
float: left;
}

#priv:hover{

background-image: url(media/pebis.png) ;
background-repeat: no-repeat;

}

#art{
height: 42px;
width: 81px;
background-image: url(media/news.png) ;
float: left;
}

#art:hover{

background-image: url(media/newsbis.png) ;
background-repeat: no-repeat;

}


#cont{
height: 42px;
width: 102px;
background-image: url(media/con.png) ;
float: left;
}

#cont:hover{

background-image: url(media/conbis.png) ;
background-repeat: no-repeat;

}

#shit{
height: 20px;
}
#footer{
}
#bottom{
background-image: url(media/bottom.jpg);
background-repeat: repeat-x;
height: 50px;

}

#bottom2{
background-image: url(media/footer.gif);
background-repeat: repeat-x;
height: 25px;

}

#espace{
height:100px;

}

#ligne1{
margin-left: 50px;
margin-right: 50px;
position: absolute;
margin-top: 50px;
border: 2px yellow dotted;

width: 870px;
height: 252px;

}

#degre{
width: 400px;
height: 250px;
background-image:url(media/comp/thumb/360.jpg);
position: absolute;
border: black 1px solid;

}

#kim{
width: 400px;
height: 250px;
background-image:url(media/comp/thumb/kim.jpg);
position: absolute;
right:0px;
border: black 1px solid;
}

#ligne2{
margin-left: 50px;
margin-right: 50px;
position: absolute;
margin-top: 330px;
border: 2px yellow dotted;

width: 870px;
height: 252px;


#p{
width: 400px;
height: 250px;
background-color: black;
position: absolute;
border: black 1px solid;

}

#s{
width: 400px;
height: 250px;
background-color:red;
position: absolute;
right:0px;

border: black 1px solid;

}


Mercii Smiley cligne
Bonjour,

Cela ne marche pas tout simplement parce que dans ton fichier css l’accolade pour #ligne2 n’est pas fermée.
Sujet clos
Aller à