I'm wondering if I can have a section to have min width both as percentage and a fixed amount. Let me be more clear, I have the following html:
<body>
<main>
<section id="home-section">
...Content...
</section>
<section id="team-section">
...Content...
</section>
</main>
</body>
I have
section{
min-width: 100%;
}
Is there a way to have min-width as both: 100% and 600px? So that if the viewport is less than 600px the width its 600px and if its more the min-width its 100%? (It can be more because of content)
You only have to do this:
section {
min-width: 600px;
}
it is automatically 100%, with a minimum of 600px.
The usual way is a bit different. You define for example:
width: 100%
max-width: 600px;
That way it will have the full width in smaller viewports, but never grow beyond 600px
P.S.: You wrote
So that if the viewport is less than 600px the width its 600px
That way it would be wider than the viewport on smaller screens - I suppose this isn't what you want, is it?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With