Line 19: | Line 19: | ||
} | } | ||
− | . | + | .container { |
− | + | position: relative; | |
+ | max-width: 800px; /* Maximum width */ | ||
+ | margin: 0 auto; /* Center it */ | ||
} | } | ||
− | . | + | .container .content { |
− | + | position: absolute; /* Position the background text */ | |
+ | bottom: 0; /* At the bottom. Use top:0 to append it to the top */ | ||
+ | background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */ | ||
+ | color: #f1f1f1; /* Grey text */ | ||
+ | width: 100%; /* Full width */ | ||
+ | padding: 20px; /* Some padding */ | ||
} | } | ||
Revision as of 21:38, 19 August 2018
- !
* Start Bootstrap - Heroic Features (https://startbootstrap.com/template-overviews/heroic-features) * Copyright 2013-2017 Start Bootstrap * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-heroic-features/blob/master/LICENSE) */
body {
padding-top: 54px;
}
@media (min-width: 992px) {
body { padding-top: 56px; }
}
.card {
height: 100%;
}
.container {
position: relative; max-width: 800px; /* Maximum width */ margin: 0 auto; /* Center it */
}
.container .content {
position: absolute; /* Position the background text */ bottom: 0; /* At the bottom. Use top:0 to append it to the top */ background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */ color: #f1f1f1; /* Grey text */ width: 100%; /* Full width */ padding: 20px; /* Some padding */
}
.bg-image-full {
height: 100%; background-color: #f2f2f2;
}