containers / containers/podman.io
[Bug]: Misspelled Tailwind Class Names `justify-content-center` and `align-items-center`
- Dominant language
- TypeScript
- Stars
- 108
- Forks
- 188
- Avg merge
- 9d 15h
- Merged PRs (30d)
- 11
Description
* **File Reference:** [CommunityMeetingsCardGrid/index.tsx](file:///c:/Users/Hp/podman.io/src/components/layout/CommunityMeetingsCardGrid/index.tsx#L195)
* **Code Pointer:**
```typescript
```
* **Technical Reason & Impact:** The developer used the full CSS property names (`justify-content-center` and `align-items-center`) instead of (`justify-center` and `items-center`). Since these classes do not exist in Tailwind's stylesheet, the browser ignores them, resulting in layout misalignment and centering failures in the meetings grid.
* **How to Reproduce:**
1. Open `/community` in a browser.
2. Inspect the wrapper element of the community meetings grid.
3. Observe that the classes `justify-content-center` and `align-items-center` are applied in HTML but have no matching CSS rules in the compiled stylesheet.
---
### Upload screenshots or screen recordings
Add screenshots or screen recordings to help explain your problem.
### LLM Policy
- [x] This issue is human-written, and folow up comments will also be human-written
Contributor guide
No contributing guide indexed for this repository
Research direction
Open src/components/layout/CommunityMeetingsCardGrid/index.tsx at the referenced wrapper and inspect its Tailwind classes. Reproduce the layout on /community, correct the two misspelled class names, and verify that the meetings grid is centered and aligned as intended.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- tailwindcss, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 1/5
- Estimated time
- Under an hour
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 88/100