Styling Div, как показано на рисунке

-3

мне нужен DIV должен быть создан таким образом, показанный на изображении Styling Div, как показано на рисунке

CSS код следующим образом:

/* Стили идут сюда */

.col-sm-3.widget_1_box { 
    padding: 0 5px; 
} 

.bg-success { 
    background-color: #dff0d8; 
} 

.tile-progress { 
    padding: 30px; 
    margin-bottom:1em;; 
}

Я создал DIV здесь в plnkr

<div class="widget_1"> 
      <div class="col-sm-3 widget_1_box"> 
       <div class="tile-progress musers"> 
        <div class="newheader"> 
         <h4><i class="topicname">Manage Users</i> </h4> 
         <!-- <div class="progress"><div class="progress-bar inviewport animated visible slideInLeft" style="width: 40%;"></div></div>--> 
         <!--<span>40% increase</span>--> 
        </div> 
       </div>

https://plnkr.co/edit/kMis2AGzSdKfc1Bhis3e?p=preview

Нужна помощь.

источник

2016-08-09 Priyoshika Ram

Пожалуйста, выкладываю полный код с CSS, которые вы уже пробовали. –

С чем вам нужна помощь? Если бы мне пришлось опасаться догадки, это были бы два параллелограмма. – Th4n0s

Добавлено CSS тоже. вы можете найти код в plnkr. –

Используйте линейный градиент,

div { 
 
    background: linear-gradient(110deg, #1e5799 50%, #663399 50%); 
 
    height: 100px; 
 
} 
 
h1 { 
 
    text-align: center; 
 
    background: #1e5799; 
 
    color: white; 
 
    border-bottom: 1px solid rgba(20, 67, 120, 1) 
 
}

<div> 
 
    <h1>HEADER</h1> 
 
</div>

источник

2016-08-09 08:27:31

Спасибо, это действительно полезно, вы можете помочь мне с дачей строки заголовка тоже. Where Управлять пользователем дано –

Обновленный ответ. –

Styling Div, как показано на рисунке

ответ

Смежные вопросы