I would like to customize my closed captions. I want to reduce the width of the captions field. Is there a way to do this? I saw some closed conversations and I found some instructions on using Javascript but I can't get it to work.
Try using this script to modify the width of the caption div. By default, it's set to 60%, which is currently what you have in your project. You can decrease this percentage as needed.
Thank you, Nedim. It worked perfectly. I adjusted the width down a little more to fit my concept. I'm doing this for a demo that I'll post next week. I appreciate your help!
6 Replies
Hi Jodi,
Try using this script to modify the width of the caption div. By default, it's set to 60%, which is currently what you have in your project. You can decrease this percentage as needed.
const addCss = css => document.head.appendChild(document.createElement("style")).innerHTML=css;
addCss(".view-desktop .caption, .theme-unified .caption {width:60%;}");
Thank you. I'll give it a try.
Thank you, Nedim. It worked perfectly. I adjusted the width down a little more to fit my concept. I'm doing this for a demo that I'll post next week. I appreciate your help!
You are welcome, Jodi.
Hi Nedim.
Thank you for the help on the javascript for the caption widths. Here is a link to how I applied it for the weekly challenge (#461):
https://jodisdemos.s3.amazonaws.com/461+Podcast/story.html
Anytime, Jodi. I like it so much. Thank you for sharing it :)