Looking for title/text overlay on media posts

• 

  jillianrmartin · Member · Jan 10, 2017 at 1:49 am

  • Copy link
  • Add topic to favorites

  Hi there,

  Does anyone know how to put a center title over media thats embeded from Vimeo?

  I have a site http://www.JillianMartin.com in which I have videos on the main page.

  I am looking to hopefully add a center title to the videos like you see here on this website. http://parkpictures.com/

  I tried adding the code below which was suggested to me. But its not working.

  Would love any thoughts if you know of how to do this!

  Thank you!

  @media only screen and (min-width: 569px) .caption { position: absolute; z-index: 59; z-index: 60; } @media only screen and (min-width: 569px) .caption { width: 100%; height: 100%; color: #fff; text-transform: uppercase; font-weight: 700; pointer-events: none; } .caption, .share { text-align: center; letter-spacing: .1em; } .caption, .share, body, button, h1, h2, h3, h4, h5, h6, input, label, p, select, textarea { font-family: Interstate,”Droid Sans”,”Arial Narrow”,”Helvetica Neue”,”Dejavu Sans”,Helvetica,Verdana,sans-serif; } article, aside, blockquote, body, dd, details, div, dl, dt, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, img, input, li, nav, ol, p, pre, section, table, td, textarea, th, tr, ul { outline: 0; border: none; } *, :after, :before { outline: 0; border: none; text-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: transparent!important;
  Hi there, Wondering if this would be the right place to ask about a Custom CSS question. I didnt see it on the forums. I have a site http://www.JillianMartin.com in which I have videos on the main page. I am looking to hopefully add a center title to the videos like you see here on this website. http://parkpictures.com/ I tried adding the code below which was suggested to me. But its not working. Would love any thoughts if you know of how to do this! Thank you! @media only screen and (min-width: 569px) .caption { position: absolute; z-index: 59; z-index: 60; } @media only screen and (min-width: 569px) .caption { width: 100%; height: 100%; color: #fff; text-transform: uppercase; font-weight: 700; pointer-events: none; } .caption, .share { text-align: center; letter-spacing: .1em; } .caption, .share, body, button, h1, h2, h3, h4, h5, h6, input, label, p, select, textarea { font-family: Interstate,”Droid Sans”,”Arial Narrow”,”Helvetica Neue”,”Dejavu Sans”,Helvetica,Verdana,sans-serif; } article, aside, blockquote, body, dd, details, div, dl, dt, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, img, input, li, nav, ol, p, pre, section, table, td, textarea, th, tr, ul { outline: 0; border: none; } *, :after, :before { outline: 0; border: none; text-shadow: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: transparent!important;

  The blog I need help with is: (visible only to logged in users)

• 

  jillianrmartin · Member · Jan 10, 2017 at 1:52 am

  • Copy link

  my copy and paste function repeated the bottom half. disregard! :)