Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11
  1. #1
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts

    video link not aligned to centre

    Having issues trying to position an embedded video link to the centre of the screen. I have right clicked the image, gone to align_centre yet the link is not in the centre of the screen
    Any advice would be appreciated.
    Attached Thumbnails Attached Thumbnails video link not aligned to centre-screenshot-2.jpg  

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,862
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Any advice would be appreciated.
    From the given input, we can only use some image editing programs like Photoshop to correct the alignment. If you are seeking help on your code, we need to see it, Or a link to your page would be much better.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    (I have not given the link a Div tag and have been trying to align it in properties)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>cfpma</title>
    <link href="css/basic.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    @import url("css/advanced.css");

    body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    }
    </style>

    <body leftmargin="300">

    <div id="wrapper">

    <div id="container">


    <div align="center">
    <object width="532" height="385">
    <param name="movie" value="http://www.youtube.com/v/amcZ6R3hPEY?fs=1&amp;hl=en_GB"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param>
    <embed src="http://www.youtube.com/v/amcZ6R3hPEY?fs=1&amp;hl=en_GB" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="532" height="385"></embed>
    </object>
    </div>
    </div>

    <ul>

    <li><a href ="INDEX.html" target="_self">HOME</a></li>
    <li><a href ="STILLS.html" target="_self">STILLS</a></li>
    <li><a href ="VIDEO.HTML" target="_self">VIDEO</a></li>
    <li><a href ="SONIC.HTML" target="_self">SONIC</a></li>
    <li><a href ="CONTACT.HTML" target="_self">CONTACT</a></li>

    </div>
    </div>


    </div>
    </body>
    </html>

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,862
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Post your CSS files too.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #5
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    @charset "utf-8";
    @import url("gallery.css");

    #container {
    width:990px;
    }

    body {
    background-color:#afafaf;
    }

    #wrapper {
    background-image:url(../images/cleared%20screen_new.jpg);
    background-position:center;
    background-repeat:repeat;
    padding-bottom:100px;
    padding-top:50px;

    }


    #dataglyph {
    margin-left: 500px;
    margin-top: 0px;
    padding-top:70px;
    }

    #banner {
    margin-left: 267px;
    margin-top: -10px;
    }

    #sub_banner {
    margin-top:5px;
    margin-bottom:15px;
    margin-left: 290px;
    }



    #text {
    font-size:100%;
    margin-top:20px;
    padding-left:295px;
    padding-right:25px;
    padding-bottom:20px;
    text-align:justify;
    }

    ul
    {
    list-style-type:none;
    margin-top:50px;
    padding:0;
    margin:0;
    padding-top:6px;
    padding-bottom:125px;
    text-align:center;
    }
    li
    {
    display:inline;
    }
    a:link,a:visited
    {

    font-size:111%;
    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    color:#FFFFFF;
    background-color:#000;
    padding:38px;
    padding-top:3px;
    padding-bottom:3px;
    text-decoration:none;
    text-transform:uppercase;

    }
    a:hover,a:active {
    background-color:transparent;
    }


    <ul>
    <li><a href="#HOME">Home</a></li>
    <li><a href="#STILLS">News</a></li>
    <li><a href="#VIDEO">Contact</a></li>
    <li><a href="#SONIC">About</a></li>
    <li><a href="#CONTACT">About</a></li>
    </ul>

  • #6
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I think this has something to do with the #wrapper and #container div tags enclosing the <ul>. The home page does not have the <ul> enclosed but seems to work

  • #7
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,862
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    I'd recommend you to position a div using the dead centre method and then put the video and links inside it.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #8
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    When I include the <ul> within the div tags the list also moves off-centre. What am I doing wrong?

  • #9
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,862
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    What am I doing wrong?
    Again, we need to see your current code to say something about it.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #10
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>cfpma</title>
    <link href="css/basic.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    @import url("css/advanced.css");


    </style>

    <body>

    <div id="wrapper">

    <div id="container">


    <div id="video">
    <object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/amcZ6R3hPEY?fs=1&amp;hl=en_GB"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/amcZ6R3hPEY?fs=1&amp;hl=en_GB" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object></div>



    <ul>
    <li><a href ="INDEX.html" target="_self">HOME</a></li>
    <li><a href ="STILLS.html" target="_self">STILLS</a></li>
    <li><a href ="VIDEO.HTML" target="_self">VIDEO</a></li>
    <li><a href ="SONIC.HTML" target="_self">SONIC</a></li>
    <li><a href ="CONTACT.HTML" target="_self">CONTACT</a></li>

    </div>
    </div>

    </body>
    </html>

  • #11
    Regular Coder
    Join Date
    Aug 2005
    Location
    MS
    Posts
    841
    Thanks
    11
    Thanked 79 Times in 77 Posts
    Didm't see the CSS for "<div id="video">", but try:

    Code:
    #video {
    width: 480px;
    height: 385px;
    margin: 0 auto;
    }
    That would center the video div within the "container" div, but I don't see where it is centered. Try:

    Code:
    #container {
    width: 990px;
    margin: 0 auto;
    }
    Centering anything requires setting a width less than 100% for the container.

    This is NOT needed:

    Code:
    body {
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    }
    Put ALL your CSS on an external CSS file. Use this at the very TOP of all the CSS:

    Code:
    * { margin: 0; padding: 0; border: 0; }
    I'm sure I missed something in all the code posted, but validate your CSS and HTML:

    CSS Validator

    HTML Validator

    Why Validate?: http://validator.w3.org/docs/why.html
    Last edited by Major Payne; 11-01-2010 at 09:30 PM.
    ☠ ☠RON☠ ☠


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •