search

bramkragten / swipe-card

Card that allows you to swipe throught multiple cards for Home Assistant Lovelace
234 stars 32 forks source link

Responsive Issue: Inconsistent card width on browser resize #84

Open przeniek opened 5 months ago

przeniek commented 5 months ago

I've encountered an unusual behavior regarding the card width when resizing the browser. During certain browser size adjustments, the card is being truncated by its container. I managed to resolve (i hope) this issue eventually by adding the following styling:

.swiper-container {
    width: 100% !important;
}

Steps to Reproduce: Open the application in a web browser. Resize the browser to various sizes. Observe the behavior of the card within its container. Expected Behavior:

The card should adjust its width appropriately, remaining fully visible within the container across different browser sizes.

Actual Behavior: The card's width does not adjust properly, resulting in it being truncated by the container at certain browser sizes.

Possible Fix: I recommend reviewing the CSS styling of the card, specifically considering the implementation of a width: 100% style for the .swiper-container to ensure better responsiveness.

Additional Information: This issue was quite frustrating to deal with, and I believe addressing it could enhance the user experience. Please let me know if any further information or assistance is needed to resolve this.

b4dpxl commented 5 months ago

Feels like this is related to https://github.com/bramkragten/swipe-card/issues/76

Where did you apply this style?

booa1986 commented 1 month ago

I have the same problem. In the Chrome browser, sometimes the tab is enlarged and cuts off the data content, and other times it's OK.