My Times CSS Help

<PLEASE USE THIS TEMPLATE TO HELP YOU CREATE A GREAT POST!>

<Below this line, add a link to the EXACT exercise that you are stuck at.>

https://www.codecademy.com/courses/freelance1-u4/projects/my-times?program_content_id=0152055d515e56bc97115fbfb512ca1c&program_id=84660132d83e63bfe58167f1d44414b1

<Below this line, in what way does your code behave incorrectly? Include ALL error messages.>

Hi, I’m working the Freelance Website Development course: Display and Positioning

For the project “My Times” i’m having trouble getting the “justify-content:space-between;” to work.
The 3 columns (or articles) are supposed to have a fixed width, and have space between them. When the webpage is scaled down, it is supposed to overflow: scroll;

Instead, all 3 of my columns are sticking together and growing and shrinking as the webpage is resized.

Are there any glaring errors in the CSS that explains this behaviori?

Let me know if posting the HTML will help.

```

header {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;

justify-content: space-between;

border: 1px solid lightgrey;

font-family: Verdana;
font-size: 14px;
font-weight: bold;
}

header p{
color: aquamarine;
display: inline-flex;
text-align: center;
padding: 10px;
}

.leftheader{
display: flex;
align-items: center;
padding: 10px;
flex-wrap: nowrap;
}

#logo {
display: inline-flex;
text-align: center;
justify-content: left;

}

nav a {
padding: 10px;
text-align: center;
color: black;
}

.bigcontainer {
display: flex;
flex-direction: row;
justify-content: space-between;
overflow: scroll;

}

.column {
border: 1px solid black;
display: flex;
flex-direction: column;
}

.large {
width: 630px;
max-width: 630px;

}

.medium {
width: 300px;
min-width: 300px;
}

.small {
width: 240px;
min-width: 240px;
}

.article {
border: solid black 1px;

}

<do not remove the three backticks above>

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.