Can CSS Override an Object Video code width?

HTML, CSS and anything else that deals with client side capabilities.

Moderator: General Moderators

Post Reply
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Can CSS Override an Object Video code width?

Post by simonmlewis »

Code: Select all

<object width="425" height="344">
This comes before the embed code from YouTube.

Can CSS overide the width??
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
McInfo
DevNet Resident
Posts: 1532
Joined: Wed Apr 01, 2009 1:31 pm

Re: Can CSS Override an Object Video code width?

Post by McInfo »

CSS can override the dimensions of the <embed>, but not the <object>.
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Can CSS Override an Object Video code width?

Post by simonmlewis »

So if the OBJECT is outside of the Embed, I won't be able to override....
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
McInfo
DevNet Resident
Posts: 1532
Joined: Wed Apr 01, 2009 1:31 pm

Re: Can CSS Override an Object Video code width?

Post by McInfo »

If the <embed> is not between <object> and </object> tags, the code probably is not the code generated by YouTube.
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Can CSS Override an Object Video code width?

Post by simonmlewis »

It is generated by youTube. The <object> tags are on the outter part of the "embed code" they supply. And as such, I cannot over ride the size of the video shown. I need to be able to, so that on a mobile site I can reduce the width, without having two video embed fields in the DB. Just controlling it via CSS.
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
McInfo
DevNet Resident
Posts: 1532
Joined: Wed Apr 01, 2009 1:31 pm

Re: Can CSS Override an Object Video code width?

Post by McInfo »

Maybe it's different in a mobile browser, but in Firefox, applying CSS to the <embed> tag resizes the video regardless of the size of the <object> element.
simonmlewis
DevNet Master
Posts: 4435
Joined: Wed Oct 08, 2008 3:39 pm
Location: United Kingdom
Contact:

Re: Can CSS Override an Object Video code width?

Post by simonmlewis »

How do you do that?
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
User avatar
McInfo
DevNet Resident
Posts: 1532
Joined: Wed Apr 01, 2009 1:31 pm

Re: Can CSS Override an Object Video code width?

Post by McInfo »

Suppose you insert the <object> snippet from YouTube into a <div> which has id="container". Then the stylesheet could contain

Code: Select all

#container embed {
    width: 300px;
    height: 240px;
}
Then an <embed> which has an ancestor with id="container" will have the given dimensions.

A more efficient CSS selector could be

Code: Select all

div#container > object > embed
In this case, <embed> must be a direct descendent of <object>, and <object> must be a direct descendent of <div id="container">.
Post Reply