Deon
Posts: 0
Joined: Sun Jun 30, 2013 6:00 am

Styling for image in List not working

Hi
There seems to be a problem with the styling of images appearing in a list. I am simply styling the images to be round using the following css that is applied to the image.

.profile_image {
border-radius:50%;
margin:10px;
border: 4px;
}

All images in the list display correctly except for the first and last list item as can be seen from the image. As you can notice, the circle is not completed properly. This is strange as it only occurs on the 1st and last record or list item retrieved from the db.

Image

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

Styling for image in List not working

Hello,

Please check CSS properties:
preborder-top-left-radius/pre for the first item
and
preborder-bottom-left-radius/pre for the last item
They might have bigger priority that yours custom CSS

Deon
Posts: 0
Joined: Sun Jun 30, 2013 6:00 am

Styling for image in List not working

Hi
All items use the same CSS. How do i set it differently for first and last item if list is populated from database?

Serhii Kulibaba
Posts: 150
Joined: Tue Aug 27, 2013 1:47 pm

Styling for image in List not working

Please use nth-first-child and nth-last-child CSS clauses for that. Here you can find examples: https://css-tricks.com/useful-nth-chi...

Deon
Posts: 0
Joined: Sun Jun 30, 2013 6:00 am

Styling for image in List not working

Thank you

seems like it only needed... !important

border-radius:50% !important;

Return to “Issues”