CODEWITHSUNDEEP
csstwitter-bootstrap-3
nontechguy
nontechguy

Reputation: 761

Using bootstrap - text to match parent div width on browser resize

I am using bootstrap and I have a background img that is aligned to the center of timer-background. I want subtext and big-text width to change to be 100% of timer-background so that I can center align them.

HTML:

<div class='col-xs-4'>
    <div class='borders timer-background'>
            <span class='subtext'>june</span><span class="big-text">05</span>
    </div>
</div>

CSS:

.timer-background {
     background: url(../assets/timer_background.png) center center no-repeat;
}

.big-text {
     font-family: 'Tulpen One', cursive;
     color: #ffffff;
     font-size: 120px;
   }

date image

Upvotes: 0

Views: 1195

Answers (1)

cfnerd
cfnerd

Reputation: 3799

Here are a few Stackoverflow articles that I think will point you in the right direction.

How can I vertically center text over a responsive image?

How to create responsive text on top of an image?

Text vertically and horizontally centered over a responsive image

Hope this helps the cause.

Upvotes: 1

Related Questions