Roland
June 13, 2017, 6:10am
1
I have a table with a cell that contains a dbr
and a button. This button should be aligned to the right of the dbr
.
<td ng-repeat="c in page.columns" ng-style="{ width: c.Width + '%' }">
<span>
<tm1-ui-dbr>...</tm1-ui-dbr>
<button type="button" class="btn btn-primary"
title="Select Financial Instrument" ng-click="selectCompanies()"
style="float: right;">
<i class="fa fa-pencil-square-o"></i>
</button>
</span>
</td>
With the html
given above the button is displayed under the dbr
and not to the right. What do I have to change to make it appear on the right?
EDIT: The dbr
actually generates a form
html element and buttons by default go below a form. So I guess that this is part of the problem
Roland
June 13, 2017, 3:19pm
2
plim
June 13, 2017, 11:26pm
3
Hi @Roland ,
Thanks for the update! By the way, the above, td element, were you using a CSS class on the table element itself (i.e. class=“table”)?
On the above part, how many columns were in the table?
–
Paul
Roland
June 14, 2017, 5:38am
4
Hi @plim
By the way, the above, td element, were you using a CSS class on the table element itself (i.e. class=“table”)?
the td
element is exactly as quoted.
My table has the following class:
<table class="table table-condensed table-hover table-striped ng-table">
On the above part, how many columns were in the table?
The table has 7 columns in total.
plim
June 14, 2017, 6:03am
5
Hi @Roland ,
Thanks! Was just curious on this because when I tried the above (I had just updated the table in an active form output for sample purposes) it shows like this:
Though at a lower resolution / smaller screen, it looks like this:
And this is how how my HTML looks like:
<td class="text-right" ng-repeat="period in ['All Months', '01', '02', '03', '04', '05', '06',]">
<tm1-ui-dbr>...</tm1-ui-dbr>
<button type="button" class="btn btn-primary"
title="Select Financial Instrument" ng-click="selectCompanies()">
<i class="fa fa-pencil-square-o"></i>
</button>
</td>
With the exception of the ng-style and extra span.
Anyways, thanks again for posting the article!
Just wanted to post the above screenshots. What you might have encountered could be due to how Bootstrap naturally handles the view, depending on screen resolution .
Cheers!
–
Paul
1 Like