Feature List width

kathrin_helmedach · April 2016

Hello!

Is it possible to change the width of the feature list items? As you can see on this page, the width of one item is very big. It is double size of the text. I just want to have it as wide as the text length.

http://jaeger.jaeger-handling.de/produkte/handy-flex/handy-flex100

Albert · April 2016

Hi,

as we can see, all items are the same width (25%). So do you mean to move the 4th item into the same line as the rest of 3 elements are?

kathrin_helmedach · April 2016

That's one concern, to move it in the same line. But what I really want to change is this big space on the right side of the text.

Have a look here, I have mark the space in yellow:

www.jaeger-handling.de/featurelist.png

Albert · April 2016

Ok, got it. So to change list item width, you need to use the following css:

.feature_list[data-col="4"] ul li { width: 15% !important; }

However, the last item won't go into the same line as list items, because the last one is not list item but just a plain link.

kathrin_helmedach · April 2016

Unfortunately nothing is changing with this css. Do you have another idea?

I have also deleted the link of the last item. It's also a list item, but still not in the same line.

[item icon="icon-acrobat" title="Maßblatt" link="" target="" animate=""]

[item icon="icon-acrobat" title="Datenblatt" link="" target="" animate=""]

[item icon="icon-acrobat" title="Ersatzteile" link="" target="" animate=""]

[item icon="icon-delicious" title="Step-Datei" link="" target="" animate=""]

Albert · April 2016

It is not true. If you look at http://pasteboard.co/nuidQG3.png you will see that the css we gave you above of course works. You must did something wrong if it does not work on your end.

kathrin_helmedach · April 2016

Well, I have pasted the css in the custom css area. I think there is not a lot what i could do wrong:

http://www.jaeger-handling.de/featurelist.PNG

And I am using the IE11 and Google Chrome 49 and in these browsers it still looks the same.

Also the the 4th item is still not in the same line.

Albert · April 2016

Ok, we see where the problem is. The css we gave you is different from what we gave you above. Just check and tell us why you added empty space between .feature_list AND [data-col="4"]

kathrin_helmedach · April 2016

Oh wow... that was really the mistake. Now it's working. Thank you!

But there was still the problem with the last item in the next line. I set the number of columns in the "feature list wrap" to 5, even if i have just 4 items, but now the last item is finally in the same line.

That's a bit strange.

Albert · April 2016

That's strange but we are glad to see that you sorted it out.

Feature List width

Comments