Skip to main content
Inspiring
Oct 20, 2019 11:58 PM UTC
Answered

Bootstrap & centering [Was: Apologies: 2 questions]

With apologies to the forum, I have two questions that are evading me. Please note that I'm using bootstrap 4 for the first time, so that is the basic problem. (I'm sure the problem is me not knowing how to use bootstrap.)

 

(1) I have tried to center a banner, but nothing seems to work. It's in a (div class="container"), and everything else in that seems to work. But inserting an image and centering it just won't work:

<img class="img-fluid pl-75 pr-75 ml-5 mr-5 w-50 h-50" src="images/29yearBanner.png" alt="Our 29th Year"/>

I've garbled the modifiers every which way, and can't get it to work. Any help would be appreciated!

 

(2) On another page, I have a field (div class="container-fluid whiteframe") with two columns in it. But I can't figure how to cause the container to reduce when the columns reduce to one.

<div class="container-fluid whiteframe">
<div class="row">
<div class="col-md-6"><img src="images/trngl&list_+notes_2019.png" alt="" width="510" class="img-fluid"> </div>
<div class="col_md_6"> <img src="images/trngl&list_2019_right.png" alt="" width="490" class="img-fluid" /> </div>
</div>
</div>

Has anyone an idea what I'm trying to say?

 

Any help would be appreciated!

Rick

 

[Topic edited by moderator for clarity.]

This topic is closed to new replies. Start a new post to keep the conversation going.
BenPleysier
BenPleysierCorrect answer
Community Expert
Oct 21, 2019 2:50 AM UTC

<img class="img-fluid d-block mx-auto" src="images/29yearBanner.png" alt="Our 29th Year"/>

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!

3 replies

BenPleysier
Community Expert
BenPleysierCommunity ExpertCorrect answer
Community Expert
Oct 21, 2019 2:50 AM UTC

<img class="img-fluid d-block mx-auto" src="images/29yearBanner.png" alt="Our 29th Year"/>

Translate
Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Inspiring
Oct 21, 2019 4:40 PM UTC

Thanks, Ben. That solves the problem completely.

Translate
Inspiring
Oct 21, 2019 12:35 AM UTC

Okay, I just figured out the answer to problem #2. It was that I had the second column defined wrong. Should not have been class="col_md_6" but "col-md-6". So now there's only one,

Rick

Translate