Comment ce concepteur (Mason Yarnell) a-t-il conçu cette bordure séparant les 3 sections de la barre de menus? De ce que je vois, c'est plus qu'une frontière solide.Comment faire ce genre de bordure css?
https://dribbble.com/shots/1315388-Dashboard-Web-App-UI-Job-Summary/attachments/184703
vous pouvez utiliser cette css pour faire de cette frontière,
Css: -
.main{height: 20px;width: 400px;margin: 100px auto;}
.main ul li{padding:10px;border-top:1px solid #2b3544;border-bottom:1px solid #303a4a;list-style: none;min-height: 50px;position: relative;}
.main ul li:after{border-bottom: 1px solid #293241;content: '';width: 100%;height: 1px;position: absolute;left:0px;top:-4px;}
.main ul li:before{border-bottom: 1px solid #3d495d;content: '';width: 100%;height: 1px;position: absolute;left:0px;top:-1px;}
.main ul li:first-child{border-top:none;}
.main ul li:last-child{border-bottom:none;}
.main ul li:first-child:after ,.main ul li:first-child:before{display: none;}
C'est parfait! –
Qu'est-ce que vous avez essayé jusqu'à présent? –
montrez votre code dans jsfiddle. – Developer
Un simple border-top: 3px solide rgb (53, 53, 53) mais je pense qu'il pourrait utiliser une boîte et placer une ombre autour d'elle. –