Line Height Edit

ems_neff · December 2020

Hi, thank you so much for your help so far on this project! I have one more question for you. I am creating a bulleted section using this code that I found in the template, but I'm having trouble adjusting the line height. Could you tell me what I can put into this to make the bulleted items closer together/reduce the line height?

Thank you!

Screen Shot 2020-12-01 at 9.27.31 AM.png

Screen Shot 2020-12-01 at 9.27.47 AM.png

Phil · December 2020

Hello,

Can you send me a link to your website with this list, please?

I will take a closer look at it, and I will try to give you the best option to achieve that.

Thanks

ems_neff · December 2020

Here is the development link for that page: http://neffdeveloper.info/internworks/advertising-2/

Let me know if you need access to the backend and I can make a temp user pass.

Thanks!

Phil · December 2020

Please, reduce the text from the Sales/Marketing Strategist, so it will not go to the second line because every item on the list takes its height from the highest one.

Thanks

ems_neff · December 2020

Hello,

I removed the "sales/" portion of that line but the line height is still the same, any other suggestions?

Thank you!

Screen Shot 2020-12-03 at 9.15.15 AM.png

Phil · December 2020

Please, put the following Custom CSS Code in Betheme -> Theme options -> Custom CSS & JS -> CSS. It will change the display of the list as you wanted it to be.

.list_item .list_left, .list_item .list_right{
	height:50px !important;
}
.list_item .list_left > *{
	margin-top:-10px !important;
}
html body .list_item .list_left.list_image img{
	max-height:50px !important;
}

Thanks

ems_neff · December 2020

Thank you! That achieved what I wanted there, but effected lists across the whole site. Is there something I can add or change to make it only target that one place?

Phil · December 2020

You can target it on a specific section by adding a Custom class.

Here you have screenshot for better understanding.

After adding this class, your CSS Code should look like this:

.list_Changer .list_item .list_left, .list_item .list_right{
	height:50px !important;
}
.list_Changer .list_item .list_left > *{
	margin-top:-10px !important;
}
html body .list_Changer .list_item .list_left.list_image img{
	max-height:50px !important;
}

Thanks

ems_neff · December 2020

Thank you so much!! I really appreciate the help!!

Line Height Edit

Comments