I think you don't need the position:absolute
you can delete this property and add this:
.collection {
display:table;
margin:auto;
}
Вопрос
I have a page set up however I am having trouble aligning the news articles to the center of the page.
Here is a link to what I have so far -
Basically I need the red area to always be the same distance from the edges, even when it expands. Is this possible?
The red container has the css of position:absolute
Any help would be hugely appreciated.
PS. this is only my first week of learning css and html so please forgive me if it is something simple.
Thanks
Решение
I think you don't need the position:absolute
you can delete this property and add this:
.collection {
display:table;
margin:auto;
}
Другие советы
There's a lot that can be impoved, but going to your question, I'd do something like this:
.collection {
position: static;
display: inline-block;
}
.roundcont {
text-align: center;
}
You basically need to remove the position: absolute; attribute from your .collection element and change its display to inline or inline-block and then set text-align center; to its parent div so now it looks centered.