Accessible News Homepage

What are you most proud of, and what would you do differently next time?

I used the dialog

<dialog>...</dialog>

tag in html and added aria attributes to sections that made sense. One thing I'd do differently is add more descriptive labels with aria attributes.

What challenges did you encounter, and how did you overcome them?

One challenge I faced was with styling the dialog element because I couldn't figure out how to position it to the right. I overcame this with these styles:

dialog {
    min-height: 100%;
    width: 70%;
    margin-inline-start: auto;
    border: none;
    padding: 1.5rem 1.25rem;
    background: var(--almost-white);
}

The margin-inline-start or margin-left set to auto pushes the dialog to the right since the margin to the left is taking up all the rest of the space.

What specific areas of your project would you like help with?

I'd like help with styling the dialog element as well as any tips on how to make any elements more accessible by either adding other role attributes or more descriptive labels.