Change font size homepage

Hi,

Block 18 is designed using module mx8 and module 10 and you can set the article title from Theme Panel > Theme Fonts – http://screencast.com/t/3vSemihmy – http://screencast.com/t/pFKa1wKg0U
To make an idea how the modules are used you can check the Excerpt section and see where each module is used – http://screencast.com/t/dpu3qqaI2m

Thanks!

Hello,

1) You can change the title position by using this custom css. It will need further customization for colors though

.td_module_mx8 {
    position: relative;
    padding-bottom: 80px;
}
.td_block_18 .td-column-3 .td_module_mx8 .td-module-meta-info{
bottom: -55px;
}
.td_module_mx8 .entry-title a{
color:black;
}
.td-module-comments a{
color:black;
}

2) As Alin stated above, you can check the excerpts section to see which module is used by which block.

Thank you!

• This reply was modified 10 years by Alin [tagDiv].

Hello,
I have tested this again and it works as expected: http://screencast.com/t/9hYOrU5xm1z
Please make sure you copy the whole code and make sure all tags are closed in your cusom css box. If the code still does not apply, please provide a link to your website so we can inspect it.
Thanks.

hello,
Please try this code:

.td_module_mx8:hover .entry-title a{
color:#005689!important;
}
.td_module_mx8 .entry-title a, .td_module_mx8 .td-post-author-name a, .td_module_mx8 .td-post-date, .td_module_mx8 .td-icon-star, .td_module_mx8 .td-icon-star-half, .td_module_mx8 .td-icon-star-empty{
color:black!important;
}
@media (min-width:1140px){
.td_block_18 .td-column-2 .td_module_mx8 .td-module-meta-info{
bottom: -60px;
}
}
@media (max-width:1140px){
.td_block_18 .td-column-2 .td_module_mx8 .td-module-meta-info{
bottom: -100px;
}
@media (max-width: 1018px) and (min-width: 767px){
.td_block_18 .td-column-2 .td_module_mx8 {
padding-bottom: 80px;
}
}
@media (max-width: 767px){
.td_block_18 .td-column-2 .td_module_mx8 {
padding-bottom: 50px;
}
.td_block_18 .td-column-2 .td_module_mx8 .td-module-meta-info{
bottom: -90px;
}
}

It could require further adjustments. Change the values to your liking.
Thank you!

Hello,

In order to change a specific viewport font size you have to use media queries like so:
@media(max-width:767px){
.td_block_18 .entry-title{
font-size:10px!important
}
}

Thank you!

Hi,
If you want to input the code in the phones area, then you have to remove the @media part. The code already contains the mobiles viewport specified so you can introduce it directly in the custom css box, not the advanced one.
Thank you!

Hi,
I tested the code again on and it seems to work as expected. I set it to change the font size to 10 pixels on the mobile version only: http://screencast.com/t/obXSjeFFci
Please check any other code you may have in your custom css box to see if there are open tags that might cause problems.
Thank you!

Hi,
that is just a warning regarding the use of the important attribute. Please provide a link to your website pointing at the block you want changed so i can inspect it and see why the code does not apply.
Thank you!

Hi,
It’s always better to see the block itself as yours will not work with the provided code. It needs a more specific code. Please use this one instead:
@media(max-width:767px){
.td_block_18 .td_module_mx8 .td-module-title a{
font-size:18px!important;
}

This should do it: http://screencast.com/t/LMnimWeRRZ9
Thanks.