Pull right button

Topic: Pull right button

tommykjensen asked 5 years ago

I have following simple html

<div class="row">
  <div>
    <button mdbBtn type="button" gradient="blue" rounded="true" mdbWavesEffect title="Save draft"><i class="fal fa-save fa-3x"></i></button>
  </div>
  <div class="pull-right">
    <button mdbBtn type="button" gradient="aqua" rounded="true" mdbWavesEffect title="Save PDF" class="pull-right"><i class="fal fa-file-pdf fa-3x"></i></button>  
  </div>
</div>

I would like the save pdf button to appear to the right. So I tried to add "pull-right" in the class not nothing happens. So how do I get one button to be pulled to the right ? Preferably without having to make two collumns in a row.

Add comment

Konrad Stępień staff answered 5 years ago

0 0 Best answer

Hi @tommykjensen,

Please visit this page to learn about flex styles.

Probably you need something like this:

<div class="d-flex justify-content-between">
  <div>
    <button mdbBtn type="button" gradient="blue" rounded="true" mdbWavesEffect title="Save draft"><i class="fal fa-save fa-3x"></i></button>
  </div>
  <div>
    <button mdbBtn type="button" gradient="aqua" rounded="true" mdbWavesEffect title="Save PDF"><i class="fal fa-file-pdf fa-3x"></i></button>  
  </div>
</div>

Best, Konrad.

tommykjensen commented 5 years ago

Thank you. I used this on the last icon "class="float-right""

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

User: Free
Premium support: No
Technology: MDB Angular
MDB Version: 8.8.1
Device: pc
Browser: Chrome
OS: Windows 10
Provided sample code: No
Provided link: No

tommykjensen

150Support score
12Questions 8Answers

0Snippets likes 0Snippets