Search code examples
htmlattributesinline-styles

HTML inline style vs style attributes (which is better)


I have encountered a simple question but can't find the answer. The question is that, when I want to use inline style, for example width and height for an element in HTML, is it better to do it by width attribute or by inline style width?

<div style="width:${widthx}; height:${heightx};"></div>

VS.

<div width="${widthx}" height="${heightx}"></div>

what about one of them being deprecated or better for SEO solutions?


Solution

  • Based on this MDN link for HTML Attributes, you should use style as attributes for <div> (or elements that are not <canvas>, <embed>, <iframe>, <img>, <input>, <object>, <video>) are considered legacy.

    From the linked MDN article:

    Note: For all other instances, such as <div>, this is a legacy attribute, in which case the CSS width property should be used instead.