Angular 5 material design full-width inputs

I’m new to angular 5, so I need to make a form with full-width inputs, and I want to every input take the whole width of its container, however, it only takes up half of it. Here is what I’m getting I’m using angular material and here is my code: Thanks. Answer On all of your mat-form-field you will need to add a class which you can call what you want but I’ll call it full-width-field so in the end it will look like this. HTML: CSS: Example take from Angular Material Docs

angular material two check boxes, only one can be checked at a time

I am very new to Angular-material so this question might sound a bit silly, but please bear with me. I have two checkboxes as following. Let’s say a user checked the first checkbox (“Apply for a Job”) then later on clicks on “Modify Job” checkbox, I want the application to automatically uncheck the first one. How can I achieve this without using radio-buttons? Answer You can put a condition on checked attribute, as in this example: Typescript: HTML DEMO

Angular change MatInput Size

I am new to Angular 4 and started working with the material components, I copied a couple of example from the official documentation but didn’t get the same result as the documentation : How do I get change the textbox width ? I tried style=”width: 200px;” style=”width:100%”; class=”col-md-x” But none of them worked, second thing is how to center that login container in the middle of the page ? I found a few answers here but none of them seems to be working as well, here is my code : ** Answer To center in the container: CSS: To style