1
Привет, я пытаюсь добиться этого, но я не очень хорош с позиционированием css.Bootstrap 3 - CSS Совместить содержимое
Я использую bootstrap 3 в качестве рамки тоже. Я не думаю, что я слишком далеко!
Что мне нужно:
Что у меня есть:
код: (с помощью SASS качестве предварительного компилятором)
.top-footer {
\t position: relative;
\t background-image: url(../img/footerBG.png);
\t color: $white;
\t padding: 50px 5em;
\t
\t .col-head {
\t \t font-weight: 600;
\t \t text-transform: uppercase;
\t \t h3 {
\t \t \t font-size: 1em;
\t \t \t margin-bottom: 5px;
\t \t \t letter-spacing: 2px;
\t \t }
\t }
\t .col-content {
\t \t font-family: $font-family;
\t \t float: right;
\t \t
\t \t img {
\t \t \t padding-top: 15px;
\t \t }
\t \t .latest-news {
\t \t \t h4 {
\t \t \t text-transform: uppercase;
\t \t \t font-weight: 600;
\t \t \t letter-spacing: 1px;
\t \t \t font-size: 14px;
\t \t \t margin-bottom: 5px;
\t \t \t }
\t \t \t p {
\t \t \t \t position: block;
\t \t \t \t font-weight: 300;
\t \t \t \t margin-bottom: 5px
\t \t \t }
\t \t \t
\t \t \t a {
\t \t \t \t text-transform: uppercase;
\t \t \t \t font-weight: 600;
\t \t \t \t color: $primary;
\t \t \t \t font-size: 14px;
\t \t \t \t &:hover {
\t \t \t \t \t color: darken($primary, 15%)
\t \t \t \t }
\t \t \t }
\t \t }
\t }
}<div class="col-md-4">
<div class="col-head">
<h3>Recent News</h3>
</div>
<div class="col-content">
<img src="<?php echo get_template_directory_uri(); ?>/img/recent-news.png">
<div class="latest-news">
<h4>Latest Updates</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam venenatis faucibus nisi... </p>
<a href="#">Read More</a>
</div>
</div>
</div>Любая помощь оценили
работает! Просто нужно плавать изображение влево! –
Добро пожаловать, рад помочь вам –