Tag: CSS
Sidenav as main navigation
Learn how to add Sidenav as main navigation In the web designing, the majority of the navigation which is used either for a web application or for the websites is the Top Navigation System. Materialize CSS offer varieties of variation for Topbar Navigation System. We at Ampersand Tutorials have deep dived on various Top Navigation…
Full width autoplay slider for Materialize CSS
Learn to implement Full width autoplay slider for Materialize CSS It is a known fact that Materialize CSS offers in-built carousel for fullscreen and full-width image sliders. However, many designers feel that the carousel seems to malfunction several times, especially when the designers used the fullwidth carousel. One of the predominant comment which we can…
How to increase sidenav width in materialize css
Learn How to increase sidenav width in materialize css Side Navigation, by default, is designed to appear on the smaller screen which will be triggered by a navigation button. Mobile Collapsible Side Navigation can be configured from Materialize CSS website. You can check the code from the following link https://materializecss.com/navbar.htmlOnce you have added the necessary HTML,…
How to increase navbar height in materialize css
Learn How to increase navbar height in materialize css At Ampersand Academy, we have already discussed how to create Navbar and how to change the colour of the navbar, various types of Navbar and how to incorporate mobile collapsible Navbar using Materialize CSS. In order to recap these topics, follow the below-mentioned links 1. Navbar in…
Quickly implement Feature discovery on page load in 3 Steps
Learn Feature discovery on page load Offer some incentive and support return visits by acquainting clients with new features and usefulness at logically significant minutes. Feature discovery prompts have more effect when they are displayed to the correct clients at logically significant minutes. At the point when displayed to the wrong client at the wrong…
Easily implement Mobile menu with accordion type sub menu items in 2021
Learn Mobile menu with accordion type sub menu items Materialize CSS is one of the most easy-to-use CSS frameworks for website development. Materialize CSS offers easy to use CSS and JS scripts to enable mobile responsive side navigation. In the previous tutorial, we have discussed how to add responsive mobile side navigation both on the…
How to open SideNav on the right in Materialize CSS in 3 Minutes
Learn How to open SideNav on the right in Materialize CSS Mobile responsive navigation is one of the important aspects of a responsive website. It is possible to create beautiful main navigation for desktop/laptop browsers, however, when we design mobile navigation it is a must to make it easily accessible from all mobiles and tablets.…
Working with colors in Materialize CSS
Learn Working with colors in Materialize CSS Changing the text and container colour on a website is one of the basic yet frequently performed tasks while designing a website. Usually, changing the colour is done using CSS. A designer can either use in-line CSS or write a class for changing the colour. In Materialize CSS, the…
Mega menu for Materialize CSS Framework
Learn Mega menu for Materialize CSS Framework and implement where it requires a huge menu This tutorial briefs how to add a Mega menu in Materializecss.com. As we know, there is no default option in Materializecss Framework for Megamenu, we take the privilege in demonstrating how to add a mega menu using simple CSS classes. …
Adding Logo to the Navbar in Materialize CSS
Learn Adding Logo to the Navbar in Materialize CSS and implement in you website and web applications In the previous tutorial, we discussed how to create Navbar using Materialize CSS Framework. If we explore the coding involved in the Navbar, there is an individual component named Logo. The Logo mentioned there is just a text…