Angular Material Container


Angular Material Container: It is very simple to create Content Container in Angular Material. Here in this tutorial we are going to explain how you can create Angular Material Content Container. You can also use our online editor to edit and run the code online.


Angular Material Container | Directive | Example

Here we are going to create first example using the <md-content> directive-

Angular Material Container | Example:

<md-content>
	 <p>Tutorialsplane.com Learn more with us....</p>  
</md-content>

Try it »

In the above example we have created a very basic container. If you run the above example it will produce output something like this –

Angular Material Content | Directive | Example


Learn More

Let us have some more example and demo about the Angular Material Content.


Angular Material Container : Add Layout Padding Example

If you want to add padding to content element you can use layout-padding attribute. Here is an example –

Angular Material Container Padding Example:

<md-content layout-padding>
	  <p>Tutorialsplane.com Learn more with us....</p>  
</md-content>

Try it »

If you run the above example it will add padding to the content.

Note : Basically <md-content> directive is used to be used individually. You should try not to add the <md-content> inside another other <md-content>. Make them siblings if you want to use them together.

Advertisements

Add Comment

📖 Read More