That’s all I need to know, Andrei …
I can take it from here.
Thank you for your prompt response.
Thank you for identifying a careless error on my part …
I’ve inserted the code properly, and the Giphys now re-size.
I noticed your code for tablets began with // instead of @ so I inserted another version of the code separately, ie- //media (max-width: 1023px) { .giphy-embed { width: 100% !important; } }
I don’t have a tablet here at the moment. Was that something I needed to do
I very much appreciate the assistance you’re providing.
What you’ve described makes sense …
However, I added it at the bottom of the existing custom code for my site, and I’m not seeing any change.
Your continued assistance will be most welcome.
Here’s what the entire Custom CSS for my site looks like now:
/*************************************
H O M E P A G E
***********************************/
#td_parallax_header_6 > header > div.meta-info > div.td-post-views,
#td_parallax_header_6 > header > div.meta-info > div.td-post-comments,
header > div.meta-info > div.td-post-views,
header > div.meta-info > div.td-post-comments
{display:none;}
#td-outer-wrap > div.td-transition-content-and-menu > div.td-header-wrap.td-header-container > div.td-header-menu-wrap > div
{width: 100%;}
#td-outer-wrap > div.td-transition-content-and-menu.td-content-wrap > div.td-header-wrap.td-header-container.td-header-style-7 > div.td-header-row.td-header-header > div > a > img
{width:1021px;}
body div#td-outer-wrap div.td-header-wrap.td-header-container.td-header-style-7 div.td-header-row.td-header-top-menu div.td-header-sp-top-menu ul.top-header-menu.td_ul_login li.menu-item
{display: none;}
body.single div#td-outer-wrap div article div.td-container div.td-post-sharing,
div.td-post-sharing.td-post-sharing-top,
#td-outer-wrap div.td-module-comments
{display:none;}
#td-outer-wrap > div.td-transition-content-and-menu.td-content-wrap > div div > div div:nth-child(5) > div > div > div.td-visible-desktop > iframe
{
border-top: 5px solid #000;
border-left: 5px solid #000;
border-right: 5px solid #000;
}
#td-outer-wrap div.td-a-rec.td-a-rec-id-sidebar div.td-visible-desktop a img
{
border-bottom:5px solid #000;
border-left: 5px solid #000;
border-right: 5px solid #000;
position:relative;
bottom: 5px;
}
#td-outer-wrap > div.td-transition-content-and-menu.td-content-wrap > div.td-footer-container.td-container > div > div aside.widget.widget_tag_cloud > div.block-title > span,
.td-footer-container .block-title > a, .td-footer-container .block-title > span,
body div#td-outer-wrap div.td-transition-content-and-menu.td-content-wrap div.td-footer-container.td-container div.td-pb-row div aside.widget.widget_text div.block-title span,
div#td-outer-wrap div.td-transition-content-and-menu.td-content-wrap div.td-container.td-pb-article-list div.td-container-border div.td-pb-row div.td-main-content div.td-ss-main-content h4.block-title span,
div#td-outer-wrap div.td-transition-content-and-menu.td-content-wrap div.td-container.td-pb-article-list div.td-container-border div.td-pb-row div.td-main-sidebar div.td-ss-main-sidebar aside.widget.widget_archive div.block-title span,
div#td-outer-wrap div.wpb_wrapper h2.wpb_heading.wpb_video_heading,
body.page div#td-outer-wrap div div.td-container div.td-container-border div.td-main-sidebar div.td-ss-main-sidebar aside.widget.widget_text div.block-title span
aside .block-title > a, aside .block-title > span
{
color: #faf992 !important;
background-color: #ee0bcd !important;
}
#menu-main-navigation-1 li.menu-item > ul > li.menu-item a
{font-size:1rem; color: #fff;}
#menu-main-navigation-1 li.menu-item > ul > li.menu-item
{background: #ff0099; }
#td_parallax_header_6 > header > div.meta-info > div.td-post-views, #td_parallax_header_6 > header > div.meta-info > div.td-post-comments, header > div.meta-info > div.td-post-views, header > div.meta-info > div.td-post-comments {
display: none;
}
#td-outer-wrap > div.td-transition-content-and-menu > div.td-header-wrap.td-header-container > div.td-header-menu-wrap > div {
width: 100%;
}
#td-outer-wrap > div.td-transition-content-and-menu.td-content-wrap > div.td-header-wrap.td-header-container.td-header-style-7 > div.td-header-row.td-header-header > div > a > img {
width: 1021px;
}
body div#td-outer-wrap div.td-header-wrap.td-header-container.td-header-style-7 div.td-header-row.td-header-top-menu div.td-header-sp-top-menu ul.top-header-menu.td_ul_login li.menu-item {
display: none;
}
body.single div#td-outer-wrap div article div.td-container div.td-post-sharing, div.td-post-sharing.td-post-sharing-top, #td-outer-wrap div.td-module-comments {
display: none;
}
#td-outer-wrap > div.td-transition-content-and-menu.td-content-wrap > div div > div div:nth-child(5) > div > div > div.td-visible-desktop > iframe {
border-left: 5px solid #000;
border-right: 5px solid #000;
border-top: 5px solid #000;
}
#td-outer-wrap div.td-a-rec.td-a-rec-id-sidebar div.td-visible-desktop a img {
border-bottom: 5px solid #000;
border-left: 5px solid #000;
border-right: 5px solid #000;
bottom: 5px;
position: relative;
}
#td-outer-wrap > div.td-transition-content-and-menu.td-content-wrap > div.td-footer-container.td-container > div > div aside.widget.widget_tag_cloud > div.block-title > span, .td-footer-container .block-title > a, .td-footer-container .block-title > span, body div#td-outer-wrap div.td-transition-content-and-menu.td-content-wrap div.td-footer-container.td-container div.td-pb-row div aside.widget.widget_text div.block-title span, div#td-outer-wrap div.td-transition-content-and-menu.td-content-wrap div.td-container.td-pb-article-list div.td-container-border div.td-pb-row div.td-main-content div.td-ss-main-content h4.block-title span, div#td-outer-wrap div.td-transition-content-and-menu.td-content-wrap div.td-container.td-pb-article-list div.td-container-border div.td-pb-row div.td-main-sidebar div.td-ss-main-sidebar aside.widget.widget_archive div.block-title span, div#td-outer-wrap div.wpb_wrapper h2.wpb_heading.wpb_video_heading, body.page div#td-outer-wrap div div.td-container div.td-container-border div.td-main-sidebar div.td-ss-main-sidebar aside.widget.widget_text div.block-title span aside .block-title > a, aside .block-title > span {
background-color: #ee0bcd !important;
color: #faf992 !important;
}
#menu-main-navigation-1 li.menu-item > ul > li.menu-item a {
color: #fff;
font-size: 1rem;
}
#menu-main-navigation-1 li.menu-item > ul > li.menu-item {
background: #ff0099 none repeat scroll 0 0;
}
#td_parallax_header_6 > header > div.meta-info > div.td-post-views, #td_parallax_header_6 > header > div.meta-info > div.td-post-comments, header > div.meta-info > div.td-post-views, header > div.meta-info > div.td-post-comments {
display: none;
}
#td-outer-wrap > div.td-transition-content-and-menu > div.td-header-wrap.td-header-container > div.td-header-menu-wrap > div {
width: 100%;
}
#td-outer-wrap > div.td-transition-content-and-menu.td-content-wrap > div.td-header-wrap.td-header-container.td-header-style-7 > div.td-header-row.td-header-header > div > a > img {
width: 1021px;
}
body div#td-outer-wrap div.td-header-wrap.td-header-container.td-header-style-7 div.td-header-row.td-header-top-menu div.td-header-sp-top-menu ul.top-header-menu.td_ul_login li.menu-item {
display: none;
}
body.single div#td-outer-wrap div article div.td-container div.td-post-sharing, div.td-post-sharing.td-post-sharing-top, #td-outer-wrap div.td-module-comments {
display: none;
}
#td-outer-wrap > div.td-transition-content-and-menu.td-content-wrap > div div > div div:nth-child(5) > div > div > div.td-visible-desktop > iframe {
border-left: 5px solid #000;
border-right: 5px solid #000;
border-top: 5px solid #000;
}
#td-outer-wrap div.td-a-rec.td-a-rec-id-sidebar div.td-visible-desktop a img {
border-bottom: 5px solid #000;
border-left: 5px solid #000;
border-right: 5px solid #000;
bottom: 5px;
position: relative;
}
.td-trending-now-title.block-title,
.td-related-title .td-cur-simple-item
{
background-color: #ee0bcd !important;
color: #faf992 !important
}
@media (max-width: 645px) {
.gphy-embed {
width: 100% !important;
}
}
Thank you for your prompt response.
I understand your suggestion, but I don’t see the Custom CSS section for articles. My content format uses Giphys in most of them.
Here’s an example: http://betterlifefocus.com/if-you-really-truly-want-to-succeed-buy-into-the-yoda-code/
You’ll see three Giphys in the article.
I’m still building this site and am working to get all the finer details inured before I start promoting it in earnest. Most of my visitors will hit it via mobile, so resolving this issue in a practical manner is a top priority for me.
I appreciate your continued assistance.