Логотип границы и радиус контура - PullRequest
Новая
       17

Логотип границы и радиус контура

0 голосов
/ 14 марта 2019

Я пытаюсь создать логотип между верхней границей моего столбца.

Я тоже пытаюсь создать контурную границу, но ей нужен радиус границы, такой как внешняя граница.

Вот мой код, который у меня есть на данный момент: 

.border-it {
background: #FFF;
float: left;
border: 0px solid #FFF;
border-radius: 10px;
outline: 2px solid #F3B802;
outline-offset: -20px;
padding: 30px;
text-align: center;}
<div class="container">
<div class="row">
    <div class="col-4">
        <div class="col-12 border-it">
            <h1>test1</h1>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid at iusto neque nisi non optio quisquam similique? Animi blanditiis culpa deleniti distinctio eveniet expedita iusto modi nihil nulla quidem quod, saepe sit tempora, voluptatem voluptatum. Autem delectus dolores, ducimus error eum hic incidunt necessitatibus odio quam quasi quos reiciendis voluptatem!</p>
        </div>
    </div>
    <div class="col-4">
        <div class="col-12 border-it">
            <h1>test2</h1>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid at iusto neque nisi non optio quisquam similique? Animi blanditiis culpa deleniti distinctio eveniet expedita iusto modi nihil nulla quidem quod, saepe sit tempora, voluptatem voluptatum. Autem delectus dolores, ducimus error eum hic incidunt necessitatibus odio quam quasi quos reiciendis voluptatem!</p>
        </div>
    </div>
    <div class="col-4">
        <div class="col-12 border-it">
            <h1>test3</h1>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquid at iusto neque nisi non optio quisquam similique? Animi blanditiis culpa deleniti distinctio eveniet expedita iusto modi nihil nulla quidem quod, saepe sit tempora, voluptatem voluptatum. Autem delectus dolores, ducimus error eum hic incidunt necessitatibus odio quam quasi quos reiciendis voluptatem!</p>
        </div>
    </div>
</div>

Здесь у меня есть скриншот того, как это выглядит сейчас и как должно быть:

как это выглядит

как и должно быть

...