Forum | Appery.io

Hi,

I would like to be able to change the size of my list component.

I do not want to change the text size, but the size of each individual "button" in the list. So example, instead of fitting 15 list items on my page without scrolling, I would like to fit 25 (all the same font size) and then scroll if I need anymore than that.

Hopefully this makes sense.

I am assuming I would have to use CSS? But not sure the exact coding to put in to do so.

Thanks

Hello Marco,

For example like this:

code[name=mobilelistName] a{
height:10px;
}/code

where mobilelistName is the name of the list

Thanks Evgene.

Would I use this code as a CSS asset?

Do I need to enter a class name on the component as well?

Marco,

You may add class too. As you will be more comfortable

I am a little confused.

I am new to working with CSS class and assets.

Can you explain what my two options are? Is the above code you gave me a CSS code or JS code?

Sorry for my confusion....

I was looking for a way to do it with Javascript as I am more comfortable with that.

I am assuming this would be ok?

Apperyio("message").attr('style', 'height: 10px !important');

Hi Marco,

Yes, that was CSS code, that you need to add to CSS asset, please read more here http://devcenter.appery.io/documentat....

Try this code:

preApperyio("mobilelistitem").css("height","10px");/pre

Where mobilelistitem - mobilelistitem name

That works great. Thanks Alena!!

I was able to change the text size and line height, following a similar process.

one more question. I have moved the text height up, but the top of my letters are being cut off, even though they do not reach the top of the list item. (almost as if there is some padding around the list item that cuts off the text.

I have added an image.

Marco,

Please post your code.

I mapped a database service to a list component and then invoked the following js code:

Appery("Spot2").css("height","12px");
Appery("Spot2").css("line-height", "6px");