javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-10 00:27:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(button): add box-sizing so anchor buttons won't exceed max-width

Browse Source 
fixes #14760
This commit is contained in:
Brandy Carney
2018-07-12 17:24:33 -04:00
parent 8e58ea4b58
commit 9c9f081970
2 changed files with 10 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
core/src/components/button/button.scss
View File

@ -106,6 +106,7 @@
z-index: 0; z-index: 0;
display: inline-block; display: inline-block;
overflow: hidden; overflow: hidden;
box-sizing: border-box;
height: var(--height); height: var(--height);

9
core/src/components/button/test/expand/index.html
View File

@ -23,6 +23,14 @@
<ion-button expand="block">Block</ion-button> <ion-button expand="block">Block</ion-button>
<ion-button expand="full">Full</ion-button> <ion-button expand="full">Full</ion-button>
</p> </p>
<p>
<ion-button expand="block">Button Block</ion-button>
<ion-button expand="block" href="#">Anchor Block</ion-button>
</p>
<p>
<ion-button expand="full">Button Full</ion-button>
<ion-button expand="full" href="#">Anchor Full</ion-button>
</p>
<p> <p>
<ion-button expand="block" color="dark" fill="outline">Block + Outline</ion-button> <ion-button expand="block" color="dark" fill="outline">Block + Outline</ion-button>
<ion-button expand="full" color="dark" fill="outline">Full + Outline</ion-button> <ion-button expand="full" color="dark" fill="outline">Full + Outline</ion-button>
@ -43,6 +51,7 @@
<ion-button expand="block" shape="round">Block + Round</ion-button> <ion-button expand="block" shape="round">Block + Round</ion-button>
<ion-button expand="full" shape="round">Full + Round</ion-button> <ion-button expand="full" shape="round">Full + Round</ion-button>
</p> </p>
</ion-content> </ion-content>
</ion-app> </ion-app>