Page MenuHomePhabricator

Fix feed width for small devices

Authored by jasonbcox on Mon, Sep 28, 18:43.


Group Reviewers
Restricted Project
rABCWEB755c7fabe991: Fix feed width for small devices

Using white-space: nowrap in conjunction with text-overflow: ellipsis produces
strange results when the parent container is too small to contain the element in question.
The parent appears unable to determine the proper width regardless of the existance of
width: 100%, similar attempted fixes, or of the sizes of parents further up the DOM.
The apparent behavior of this issue is documented by this post:

However, the post does not identify the actual root cause, and the proposed solutions only
appear to work in specific circumstances. Rather than wrestle with this further, I opted
to just enforce the layout of the blog feed based on screen size. This produces consistent
results for small devices without altering the experience for larger devices.

Test Plan

make serve
View the homepage on various screen sizes. The feed should appear to grow and shrink with the
screen size as one would expect.

Diff Detail

rABCWEB Bitcoin ABC Website
Automatic diff as part of commit; lint not applicable.
Automatic diff as part of commit; unit tests not applicable.

Event Timeline

6 ↗(On Diff #23909)

posts-list was removed because it's not used and not defined anywhere.

This revision is now accepted and ready to land.Mon, Sep 28, 20:03
This revision was automatically updated to reflect the committed changes.