Search Results for 'css'

Hi,

Please add this CSS in Theme Panel > Custom CSS:

.header-logo-wrap img {
max-width: 200px;
}

.header-logo-wrap {
margin-top: 10px;
}

.td-a-rec-id-header {
top: 0px;
}

Thanks

Hi,

1. Use this CSS for the video issue:

.wpb_video_wrapper iframe {
width: auto !important;
}

Add it in Theme Panel > Custom CSS.
About the thumbnail, can you please give me an example?

2. Unfortunately I don’t know any plugin that helps you to get rid of the ad, those ads are set to be displayed by video owner.

Hi,

Use this CSS in Theme Panel > Custom CSS:

.td-tags li{
display: inline;
float: none !important;
}

.td-tags {
text-align: center;
}

.post-source-via {
text-align: center;
}

Result: http://screencast.com/t/6rlasrObv

Thanks

Hi,

Please add the custom CSS from below in Theme Panel > Custom CSS, like this: http://screencast.com/t/8tLnbdoW59

.comments_b10 {
height: 50px;
background-color: orange !important;
}

.comments_b10 p {
position: relative;
top: 15px;
}

Thanks

Hi,

Please add this code: http://pastebin.com/Pjjxr6bn like here: http://screencast.com/t/vEwlVMtn

Also add this custom CSS in Theme Panel > Custom CSS:

.td_mod6 .thumb-wrap {
margin-bottom: 0px;
}

.td_mod6 .td-social-sharing-buttons {
width: 50%;
margin-top: 0px;
margin-right: 0px;
}

Result: http://screencast.com/t/fh1uw13KQsQn

Thanks

Hi,

The best solution is to remove the breadcrumb code from each page, this example is from page template: http://screencast.com/t/WtHkRwhOyN

Another way that you can do it’s to set the breadcrumbs not to be displayed through all site via CSS and then also using custom CSS and set them be displayed only on post pages.

Add this CSS in Theme Panel > Custom CSS:

.entry-crumbs {
display: none;
}

.td-grid-wrap {
padding-top: 34px !important;
}

.single .entry-crumbs {
display: inline;
}

.single .td-grid-wrap {
padding-top: 49px !important;
}

Hope this helps!
Thanks

Hi,

Thanks for letting us know, we already know about this issue and we will try to fix it in future updates.
If you eventually decide to use it like that you can do it by adding this custom CSS in Theme Panel > Custom CSS:

@media (max-width: 767px) {
 .single .span4.column_container {
display: none !important;
}  
}

This will set the sidebar not to be displayed on mobile via CSS.

Sorry for the inconvenience and thanks for the message

Hi,

You can change it via CSS, just add this custom CSS:

.td_block_slide .item {
background-color: aqua !important;
}

..in Theme Panel > Custom CSS.

Here I have change on your site, simply replace the color with your own: http://screencast.com/t/thHEAxC5Auqe

Also if you want you can use this CSS to stretch the images to fill the whole container.

.iosSlider .entry-thumb {
width: 100%;
}

..like this: http://screencast.com/t/MeSeSF1Z

Hope this helps!

Thanks

Hi,

You can do it using Revolution Slider.
First create a Slider with posts that you want to be displayed in the slider. If you don’t know how to create a slider follow this steps:
https://forum.tagdiv.com/topic/revolution-sliders-source-post-not-working/#post-15382

Then you have to edit slider template and set the navigation type to bullet and the navigation style to round like this : http://screencast.com/t/VyfEV6kM

Last step, add this custom CSS in Theme Panel > Custom CSS:

/* change the bullet's default background */
.tp-bullets .bullet {
	background: #000 !important;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	padding: 3px;
}

/* adjust bullet background on mouse over */
.tp-bullets .bullet:hover {
	background: rgba(0, 0, 0, 0.65) !important;
}

/* represents the numbers that will be shown */
.tp-bullets .bullet:after {
	position: absolute;
	top: 6px;
	left: 9px;
	color: #FFF;
	font: bold 12px Arial;
}

/* First Bullet */
.tp-bullets .bullet:nth-child(1):after {
	content: "1";
}

/* Second Bullet */
.tp-bullets .bullet:nth-child(2):after {
	content: "2";	
}

/* Third Bullet */
.tp-bullets .bullet:nth-child(3):after {
	content: "3";	
} 

/* 4-th Bullet */
.tp-bullets .bullet:nth-child(4):after {
	content: "4";	
} 

/* 5-th Bullet */
.tp-bullets .bullet:nth-child(5):after {
	content: "5";	
} 

/* 6-th Bullet */
.tp-bullets .bullet:nth-child(6):after {
	content: "6";	
} 

/* 7-th Bullet */
.tp-bullets .bullet:nth-child(7):after {
	content: "7";	
} 

/* 8-th Bullet */
.tp-bullets .bullet:nth-child(8):after {
	content: "8";	
} 

/* 9-th Bullet */
.tp-bullets .bullet:nth-child(9):after {
	content: "9";	
} 

/* 10-th Bullet */
.tp-bullets .bullet:nth-child(10):after {
	content: "10";
        left: 5px;	
} 

/* 11-th Bullet */
.tp-bullets .bullet:nth-child(11):after {
	content: "11";
	left: 5px;
} 

/* 12-th Bullet */
.tp-bullets .bullet:nth-child(12):after {
	content: "12";
	left: 5px;
} 

/* 13-th Bullet */
.tp-bullets .bullet:nth-child(13):after {
	content: "13";
	left: 5px;
} 

/* 14-th Bullet */
.tp-bullets .bullet:nth-child(14):after {
	content: "14";
	left: 5px;
} 

/* 15-th Bullet */
.tp-bullets .bullet:nth-child(15):after {
	content: "15";
	left: 5px;
} 

/* 16-th Bullet */
.tp-bullets .bullet:nth-child(16):after {
	content: "16";
	left: 5px;
} 

/* 17-th Bullet */
.tp-bullets .bullet:nth-child(17):after {
	content: "17";
	left: 5px;
}

/* 18-th Bullet */
.tp-bullets .bullet:nth-child(18):after {
	content: "18";
	left: 5px;
} 

/* 19-th Bullet */
.tp-bullets .bullet:nth-child(19):after {
	content: "19";
	left: 5px;
} 

/* 20-th Bullet */
.tp-bullets .bullet:nth-child(20):after {
	content: "20";
	left: 5px;
}  

/* 21-th Bullet */
.tp-bullets .bullet:nth-child(21):after {
	content: "21";
	left: 5px;
} 

/* 22-th Bullet */
.tp-bullets .bullet:nth-child(22):after {
	content: "22";
	left: 5px;
} 

Result: http://screencast.com/t/i2H6Hh4rd

Hope this helps!
Thanks

Hi,

Should work http://screencast.com/t/BekBMiwAD

Please make sure you add and have both custom CSS I gave you in Theme Panel > Custom CSS. I will add them again here:

 @media (max-width: 767px){
.header-logo-wrap img {
display: block !important;
}
.header-logo-wrap {
display: block !important;
}
}

Thanks