1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Adding nice border to videos (easy)

Discussion in 'Tips and Guides [Archive]' started by mrGTB, Nov 5, 2011.

  1. mrGTB

    mrGTB Well-Known Member

    If you don't like the rather bland look of video displayed in treads, there is a very easy way to put a border around them that cross-browser compatible and doesn't require you set-up height and width.

    For this example I use the YouTube BBCode here.

    1: go to your you EXTRA.css template stylesheet and add this new CSS entry in it

    Code:
    .video_border
    {
        background-color: @primaryLightest;
        border: 1px solid @primaryLighterStill;
        padding: 4px;
    }
    2: Go to YouTube in (BB Code Media Sites)

    Now add a class to it so the code looks like this below (CSS Class added extra in red).

    The result will look like this below: And you can follow the same step adding that class to all other videos like Vimeo to give them a border, but still only using that one CSS Class added in EXTRA.css

    youtube.png
     
    Fuhrmann likes this.
  2. Digital Doctor

    Digital Doctor Well-Known Member

    Can I add a footer with some text ?
    video.footer.with.text.jpg
     
  3. mrGTB

    mrGTB Well-Known Member

    This is not a DIV wrapped around the video itself method, so not really. I don't think so without messing around with it. I would image you'll have to go the other route of wrapping a DIV or SPAN class around it, then doing it that way. I avoid using that method because it has problems in some browsers displaying the border correctly.

    Your better including the class with the video, the same way you'd include a class with an IMG tag to create borders.

     

Share This Page