All Posts

5 tips to improve your css


Oct 1, 2020

Share this post:

If you work with a CSS file, you know your way around this world. Some people might say that CSS is a straightforward language, so it makes it hard to make a mistake. By putting a set of rules for your website, it doesn’t mean that it’s done. However, some small sites only require a couple of CSS files, the rule before mention might work. In other cases, such as large applications, some situations can get out of control. The big question is how you can manage these kinds of situations?

Here are 5 tips for your CSS which can help you to bring out the best from your styles.


Your main step is deciding if you really need to use a CSS framework. There are many lightweight options for a robust framework. Also, some of the selectors from a framework, you might never use, so your bundle will contain dead code.  

By using styles only for your buttons, you must outsource them to your CSS file and delete the rest. In addition, you can find unused CSS rules code by applying for coverage in DevTools. 

To find it, you must look for Coverage in the Tools panel. Then, you access to the Tools panel by using Ctrl + Shift + P. You need to start recording by clicking on the reload button. Now, everything that pops up in red is unused.


Your CSS can get overload sometimes. Thus, you can minimize the size of your CSS bundles by using the right HTML elements. For example:

With a span element as a header, the default display or font style will be revoked. This helps you by using an h1, h2, or h3 instead. They already have the styles that you need to for other elements. 


On some occasions is hard to spot a redundancy, and even more when repeating rules don’t follow an order in the selectors. However, it is better to outsource your rules when your classes differ and use them as an extra class. 

Try something different


When writing CSS, this is one of the most common mistakes developers make. Even if you think that is not necessary to remove the highlight that outlines create, you are making your site inaccessible. 

Note: users using only keyboard navigation won’t have an idea about what they are focusing your site. Also, elaborate custom outlines, if the look doesn’t match your brand. 


Use a mobile-first every time that you have a deal with media queries. This means that mobile will be your first approach by writing CSS for small screen devices It will ensure that you add extra rules for your large devices, rather than rewriting your CSS rules. 

 Here at Gladumedia, we provide state-of-the-art technological solutions through our CSS knowledge. Whether your company needs IT, development, e-commerce, or cloud solutions, we have the experience and expertise that any digital project demands. Contact us today to learn more about our offerings!

Enjoy this post?

Join Our newsletter

    Keep reading

    UI/UX in the Real World: Successes in Physical Products

    UI/UX in the Real World: Successes in Physical Products

    Discover how User Interface (UI) and User Experience (UX) transform physical products. Examples like the Tesla Model S and Apple iPhone show how great UI and UX can revolutionize customer satisfaction and efficiency in everyday products. Invest in excellence and make a difference!

    Magento: Boosting your eCommerce Success

    Magento: Boosting your eCommerce Success

    Magento is a leading eCommerce platform thanks to its versatility, advanced features, and focus on SEO. It allows for complete customization and effortless scalability, ideal for businesses of all sizes. Magento is the perfect choice for lasting success. Boost your online business with Magento!

    Top 8 WooCommerce Themes for an Online Store

    Top 8 WooCommerce Themes for an Online Store

    Explore our selection of the 8 best WooCommerce themes for online stores. These themes not only offer spectacular design but also powerful features to boost your digital success. Find the perfect theme for your online store and captivate your customers from the first click.

    Artificial Intelligence in the Retail and E-commerce World

    Artificial Intelligence in the Retail and E-commerce World

    Discover how Artificial Intelligence (AI) is reshaping the retail and e-commerce landscape. From automating operations to predicting trends, AI’s impact is transformative. Enhancing customer experiences through personalization, optimizing processes, and preventing fraud, AI is redefining the way businesses thrive in this evolving digital era.

    Maximizing the Potential of Email Marketing

    Maximizing the Potential of Email Marketing

    Email marketing has emerged as a powerful and versatile tool. Despite the rise of social media and other online communication forms, email remains an essential channel to reach customers directly and personally.