Skip to main content
Inspiring
October 20, 2019
Answered

Bootstrap & centering [Was: Apologies: 2 questions]

  • October 20, 2019
  • 2 replies
  • 625 views

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 has been closed for replies.
Correct answer BenPleysier

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

2 replies

BenPleysier
Community Expert
BenPleysierCommunity ExpertCorrect answer
Community Expert
October 21, 2019

<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!
Inspiring
October 21, 2019

Thanks, Ben. That solves the problem completely.

Inspiring
October 21, 2019

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