XliteRSPS
XliteRSPS

Reputation: 106

Very simple html/css centering trouble

I just spent like an hour on something very, very simple. I use to work with HTML and CSS a long time ago but have since then forgotten how to use it. What I need to do is center the div that has the media player inside it.

All feedback is appreciated. Thanks in advance.

Here's my code:

<!DOCTYPE html PUBLIC>
<html>
    <head>
        <style type="text/css">
            h1 {
                text-align:center;
            }
            #vid {

            }
        </style>
        <body>
            <h1>Pysch Season 6 Episode 1</h1>
            <h1>Shawn Rescues Darth Vader</h1>
            <div id="vid">
                <OBJECT id="vid" CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" 
                    CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab" WIDTH="700" HEIGHT="500" >
                    <PARAM NAME="src" VALUE="lol.mp4" >
                    <PARAM NAME="autoplay" VALUE="true" >
                    <EMBED SRC="lol.mp4" TYPE="image/x-macpaint" 
                    PLUGINSPAGE="http://www.apple.com/quicktime/download" WIDTH="700" HEIGHT="500" AUTOPLAY="true"></EMBED>
                </OBJECT>
            </div>
        </body>
</html>

Upvotes: 0

Views: 109

Answers (2)

BradStevenson
BradStevenson

Reputation: 1994

You can set the display to block, and then left and right margins to auto.

#vid
{
    Display: block;
    Margin-right: auto;
    Margin-left: auto;
}

Upvotes: 1

Zoltan Toth
Zoltan Toth

Reputation: 47677

#vid {
    width: 700px;
    margin: 0 auto;
}

Upvotes: 2

Related Questions