When adding width and height to an iframe that has a style tag, which spot do you keep it in?

When adding width and height to an iframe that has a style tag, which spot do you keep it in?

The beginning iframe part, or in the style tag? You can’t use both cause the one after the first one cancels the one before that out. And it makes no sense to have it in both spots.

<iframe width="266" height="150" src="https://www.youtube.com/embed/bU8fLRxB4nI?rel=0&amp;start=20&disablekb=1&amp;vq=medium&amp;showinfo=0&controls=1&amp;autoplay=0&iv_load_policy=3&fs=0&amp;wmode=transparent" style="width: 266px; height: 150px; background-color:#000000; cursor: pointer; border:0px; "></iframe>

This is wordy, but please give it a try and see if it makes sense. In the interest of vocabulary/terminology I am trying to help you distinguish the difference between tags, attributes, and CSS properties and answer your question. :slight_smile: I may need more :coffee: .

The “style” attribute allows one to include CSS properties inline with the HTML element. It’s routine use is discouraged, as you know.

At the moment, you do not have a “style” tag in your code - if you did, it would be in the <head> section of the HTML and would contain CSS code - so I will assume you are asking about the HTML “style” attribute with the inline CSS properties.

In your HTML for the iframe, you have CSS properties within the “style” attribute.

If you have an iframe tag with the “width” and “height” attributes populated, you should not need to also include the width and height properties in the inline CSS in the “style” attribute. You can, but it’s redundant. If the “width” and “height” properties are omitted from the iframe tag then the width and height properties must be included in the CSS.

If both HTML attributes and inline CSS properties are used, the CSS properties will override the HTML attributes. That is why including both is redundant.

5 Likes

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.