Probleme HTML/CSS avec bordure
clem25
-
ReDLoG -
ReDLoG -
Bonjour,
voila j ai une bande bleu sur ma liste. J aimerais a la place des bordures de couleur bleu au dessus et en dessous. J ai tout essaye mais je n y arrive pas.
Je suis novice alors merci de votre comprehension.
voila le code:
#bar {
background-color: #0174DF;
float:left;
width:100%;
border: 10px;
border-color: black;}
#menu { border:10px
border-color: black;
}
#menu ul li{
display: inline;
float:left;
font: bold 1.1em 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, Sans-Serif;
list-style: none;
}
#menu ul li a {
position: relative;
float: left;
color: #2E2E2E;
padding: 5px 5px;
margin: 5px 5px;
text-decoration: none;
}
a{
color:white;
}
#form {
margin-left: 200px;
float:left;
position: relative;
bottom: -4px;
}
#mainpage {
margin: 40px 40px 40px 40px;
padding-top: 50px;
border: 10px;
</style>
</head>
<body>
<div id="bar">
<div id="menu">
<ul>
<li id="current"><a href="index.html">Home</a></li>
<li><a href="index.html">What we do</a></li>
<li><a href="index.html">Join Us</a></li>
<li><a href="index.html">Contact</a></li>
</ul>
</div>
</div>
<div id="mainpage">
<p> iqjfbiqwbjefpqiwjfbeqpwibfjqipwoebfj
</div>
voila j ai une bande bleu sur ma liste. J aimerais a la place des bordures de couleur bleu au dessus et en dessous. J ai tout essaye mais je n y arrive pas.
Je suis novice alors merci de votre comprehension.
voila le code:
#bar {
background-color: #0174DF;
float:left;
width:100%;
border: 10px;
border-color: black;}
#menu { border:10px
border-color: black;
}
#menu ul li{
display: inline;
float:left;
font: bold 1.1em 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, Sans-Serif;
list-style: none;
}
#menu ul li a {
position: relative;
float: left;
color: #2E2E2E;
padding: 5px 5px;
margin: 5px 5px;
text-decoration: none;
}
a{
color:white;
}
#form {
margin-left: 200px;
float:left;
position: relative;
bottom: -4px;
}
#mainpage {
margin: 40px 40px 40px 40px;
padding-top: 50px;
border: 10px;
</style>
</head>
<body>
<div id="bar">
<div id="menu">
<ul>
<li id="current"><a href="index.html">Home</a></li>
<li><a href="index.html">What we do</a></li>
<li><a href="index.html">Join Us</a></li>
<li><a href="index.html">Contact</a></li>
</ul>
</div>
</div>
<div id="mainpage">
<p> iqjfbiqwbjefpqiwjfbeqpwibfjqipwoebfj
</div>
2 réponses
-
Bonsoir,
Je ne vois que des bordures de 10 pixels noires dans le style :#bar { float: left; width: 100%; border: 10px; border-color: black; background-color: #0174DF; } #menu { border: 10px border-color: black; } -
j ai essaye meme juste ac la liste et des bordures et ca ne marche pas.
comment peut-on mettre une bordure atour d'une liste inline-
Testé avec IE 9.0 et Google Chrome 24.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>• TEST - clem25 •</title> <style type="text/css" media="screen"> #bar { float: left; width: 100%; border: none; } #menu { border: none; background-color: #0174DF; } #menu ul {margin: 0; padding: 0; border: none;} #menu ul li { display: inline; float: left; list-style: none; font-family: 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, Sans-Serif; font-weight: bold; font-size: 1.1em; border: none; border-top: 4px solid #0174df; border-bottom: 4px solid #0174df; } #menu ul li a { position: relative; float: left; margin: 5px 5px; padding: 5px 5px; color: #000; text-decoration: none; } #menu ul li a:hover {text-decoration: underline;} a {color: #fff;} #form { position: relative; float:left; bottom: -4px; margin-left: 200px; } #mainpage { margin: 40px 40px 40px 40px; padding-top: 50px; border: none; } </style> </head> <body> <div id="bar"> <div id="menu"> <ul> <li><a href="index.html">Home</a></li> <li><a href="index.html">What we do</a></li> <li><a href="index.html">Join Us</a></li> <li><a href="index.html">Contact</a></li> </ul> </div> </div> <div id="mainpage"> <p> </p> </div> </body> </html>
-
