'Button was not aligned properly in firefox
app.component.html:
<div class="input-group col-12 d-flex align-items-baseline pb-3">
<p class="mb-0 pb-3 col-12">Check....</p>
<input type="url" class="form-control" id="validationCustomUsername" placeholder="Enter your Target Url"
[(ngModel)]="domainUrl"
aria-label="Large" aria-describedby="inputGroup-sizing-sm" (keyup)="onChange()">
<div class="input-group-prepend">
<button class="input-group-text" id="inputGroup-sizing-lg" (click)="scan()"
[disabled]="!domainUrl || !domainUrl.length">{{submitBtntext}}
</button>
</div>
</div>
I have input and button it looks good in chrome but it was not aligned correctly in firefox.
Solution 1:[1]
You can use specific CSS for firefox by using
@-moz-document url-prefix() {
###your css
}
read firefox documentation from here for more info. https://developer.mozilla.org/en-US/docs/Web/CSS/Mozilla_Extensions
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | ManulMax |