CODEWITHSUNDEEP
htmlcssbuttonalignment
jblakeley
jblakeley

Reputation: 846

HTML Button Won't Right Align

I have the following HTML. I want the "Get Geotag" button to be right aligned and the text to be anywhere before/to the left of the button. However, currently I cannot figure out a way to get the buttons aligned properly and to continue functioning (the text for the input is based off of getLoc()). Any help would be appreciated! 

          <button class="button button-positive button-clear pull-right" ng-click="getLoc()"  readonly>
                Get Geotag
            </button>
          <input type="text" value="{{geoString}}">

There is no related CSS.

I tried this: Get Geotag

which aligns correctly but then the location functionality goes away. I also tried to use things like float: right and right-align to no avail.

Upvotes: 2

Views: 1302

Answers (2)

Rajib.Hassan
Rajib.Hassan

Reputation: 93

It is difficult to say without your css. But I'm trying to help you. CSS:

.my_css{display:inline-block}

HTML:

<button class="button button-positive button-clear pull-right my_css" ng-click="getLoc()"  readonly>
    Get Geotag
</button>
<input type="text" value="{{geoString}}">

Upvotes: 0

CptKicks
CptKicks

Reputation: 441

 <div class="center">
<button class="button button-positive button-clear pull-right" ng-click="getLoc()"  readonly>
            Get Geotag
        </button>
      <input type="text" value="{{geoString}}"></div>

Two Options: 1. .center{display:inline-block;} 2. .center{display:flex; flex-direction:row; justify-content:space-around; /* you could also use justify-content:space-between; *\ }

My code had a typing mistake. Fixed it

Upvotes: 1

Related Questions