body {width: 100%;}
, то ширина макета адаптируется под окно браузера. body {width: 80vw;}
body {width: 120%;}
или body {width: 120vw;}
соответственно. body {
min-height: 100vh;
margin: 0;
padding: 0;
overflow: hidden; /* прокрутка убрана */
font-family: Lora, serif;
font-size: calc(14px + .3vw);
}
body {
min-height: 100vh;
margin: 0;
padding: 0;
overflow: scroll; /* прокрутка вставлена */
font-family: Lora, serif;
font-size: calc(14px + .3vw);
}
.rd-n-left:hover {z-index: 10;}
.rd-n-right:hover {z-index: 10;}
и будет всё в норме.Ещё там, внизу, один лишний </div>
border-image:
<div class="boxic"><b>- Тыц -</b></div>
почти готов. .boxic:hover{}
, .boxic:active{}
и cursor: pointer;
.col-xs-6:hover {background: rgba(0,0,0,.2);}
<nav class="prost">
<a href="http://indexru.html" rel="nofollow">Раздел 1</a>
<a href="http://uslugi.html" rel="nofollow">Раздел 2</a>
<a href="http://kontaktru.html" rel="nofollow">Раздел 3</a>
<a href="http://about.html" rel="nofollow">Раздел 4</a>
</nav>
.prost{
margin: 1px;
padding: 8px;
text-align: center;
background: rgba(150, 200, 210, .8);
}
<svg id="seg" viewBox="0 0 400 400" style="background: #acc;">
<defs>
<g id="circle"><circle r="50%" cx="0%" cy="0%"/></g>
</defs>
<style>
#mal {font: italic 12px sans-serif;fill: #000;}
#seg {border-radius:30%;transform: rotate(0grad);} /* здесь - вращать треугл вместе с содержимым*/
#circle {
fill: none;
stroke: #f82;
stroke-width: 100%;
stroke-dasharray: 29% 360%;
} /* Здесь можно сузить бёдра треугла */
</style>
<symbol id="txt" x="0" y="0" viewBox="0 0 200 200" width="100" height="100" style="background-color: #c6c;">
<text id="mal" x="0" y="42%">Текст по центру </text>
<text id="mal" x="0" y="50%">и при этом не заходит за</text>
<text id="mal" x="0" y="58%">границы фигуры </text>
</symbol>
<use xlink:href="#circle" x="7.1%" y="0%" width="20" height="20" transform="rotate(73, 110, 110)"></use>
<use xlink:href="#txt" x="5%" y="0%" width="400" height="400" transform="rotate(-90, 200, 200)"></use>
</svg>
<!-- -->
body {background:
radial-gradient(black 15%, transparent 16%) 0 0,
radial-gradient(black 15%, transparent 16%) 8px 8px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
background-color:#243844;
background-size:16px 16px;
background-attachment: fixed;
}
<div class="box"></div>
.box {
margin: 1rem;
width: 15rem;
height: 15rem;
box-sizing: border-box;
text-align: center;
vertical-align: center;
border: 6.5rem solid transparent;
border-image: radial-gradient(#bcc, #888 30%,
#e62 50%, #2cc, #828 69%, transparent 72%) 10% fill;
}
animation: animation linear 1s 0s infinite;
/* linear | ease-in | ease-out | ease-in-out | cubic-bezier(x1,x2,x3,x4) */
Взял отсюда