What's the maximum of breakpoints a responsive website should have?
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
I was wondering if there's a maximum number of breakpoints that a website should have. Just a way of seeing ifit has too many breakpoints which I believe is not a good sign, or is it?
The website I built has 8 breakpoints. Is it bad? Should I have less?
The site is a bit complex althought I tried to gather as much code as I could that has the same characteristic, like:
CSS:
nav ul li, table, video, section ul, footer, .botoes, #nome, #destaque {
margin: auto;
}
nav ul li, .lista p, .smilies {
font-size: 37px;
}
css responsive breakpoints
asked Jan 4 at 6:31
GrayGray
114
add a comment |
I was wondering if there's a maximum number of breakpoints that a website should have. Just a way of seeing ifit has too many breakpoints which I believe is not a good sign, or is it?
The website I built has 8 breakpoints. Is it bad? Should I have less?
The site is a bit complex althought I tried to gather as much code as I could that has the same characteristic, like:
CSS:
nav ul li, table, video, section ul, footer, .botoes, #nome, #destaque {
margin: auto;
}
nav ul li, .lista p, .smilies {
font-size: 37px;
}
css responsive breakpoints
asked Jan 4 at 6:31
GrayGray
114
This question is either too broad, opinion based or requires discussion and so is off-topic for Stack Overflow. If you have a specific, answerable, programming issue, please provide full details.
– Paulie_D
Jan 4 at 11:10
add a comment |
I was wondering if there's a maximum number of breakpoints that a website should have. Just a way of seeing ifit has too many breakpoints which I believe is not a good sign, or is it?
The website I built has 8 breakpoints. Is it bad? Should I have less?
The site is a bit complex althought I tried to gather as much code as I could that has the same characteristic, like:
CSS:
nav ul li, table, video, section ul, footer, .botoes, #nome, #destaque {
margin: auto;
}
nav ul li, .lista p, .smilies {
font-size: 37px;
}
css responsive breakpoints
asked Jan 4 at 6:31
GrayGray
114
I was wondering if there's a maximum number of breakpoints that a website should have. Just a way of seeing ifit has too many breakpoints which I believe is not a good sign, or is it?
The website I built has 8 breakpoints. Is it bad? Should I have less?
The site is a bit complex althought I tried to gather as much code as I could that has the same characteristic, like:
CSS:
nav ul li, table, video, section ul, footer, .botoes, #nome, #destaque {
margin: auto;
}
nav ul li, .lista p, .smilies {
font-size: 37px;
}
css responsive breakpoints
css responsive breakpoints
asked Jan 4 at 6:31
GrayGray
114
asked Jan 4 at 6:31
GrayGray
114
asked Jan 4 at 6:31
GrayGray
114
asked Jan 4 at 6:31
GrayGray
114
asked Jan 4 at 6:31
GrayGray
114
114
This question is either too broad, opinion based or requires discussion and so is off-topic for Stack Overflow. If you have a specific, answerable, programming issue, please provide full details.
– Paulie_D
Jan 4 at 11:10
add a comment |
This question is either too broad, opinion based or requires discussion and so is off-topic for Stack Overflow. If you have a specific, answerable, programming issue, please provide full details.
– Paulie_D
Jan 4 at 11:10
This question is either too broad, opinion based or requires discussion and so is off-topic for Stack Overflow. If you have a specific, answerable, programming issue, please provide full details.
– Paulie_D
Jan 4 at 11:10
This question is either too broad, opinion based or requires discussion and so is off-topic for Stack Overflow. If you have a specific, answerable, programming issue, please provide full details.
– Paulie_D
Jan 4 at 11:10
add a comment |
1 Answer
1
active
oldest
votes
You should just keep it simple and use as few breakpoints as possible to achieve the wanted results. There is no absolute maximum number for this, as more complex websites probably require more breakpoints.
This explains good practices using breakpoints well.
Mobile-first design is something one should be aware though: Create your website for small screens first, and set breakpoints as the screen gets bigger, not the other way around. This is useful, because this way you let computers, which usually have more processing power than smartphones, handle breakpoints, and smartphones can just display the site "as is", without having to calculate large amounts of breakpoints.
Read more about mobile first
answered Jan 4 at 6:37
BenniBenni
473513
I see... Thank you! :) Btw, the way I tried to gather as much code as I could that has the same characteristics, that's basically what cascade method is, right? We are suppose to do it like that, correct?
– Gray
Jan 4 at 6:44
Yes, that's exactly as you should write code. There is almost never an excuse to use the same code multiple times, except perhaps in some cases for the sake of readability.
– Benni
Jan 4 at 8:22
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54034050%2fwhats-the-maximum-of-breakpoints-a-responsive-website-should-have%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You should just keep it simple and use as few breakpoints as possible to achieve the wanted results. There is no absolute maximum number for this, as more complex websites probably require more breakpoints.
This explains good practices using breakpoints well.
Mobile-first design is something one should be aware though: Create your website for small screens first, and set breakpoints as the screen gets bigger, not the other way around. This is useful, because this way you let computers, which usually have more processing power than smartphones, handle breakpoints, and smartphones can just display the site "as is", without having to calculate large amounts of breakpoints.
Read more about mobile first
answered Jan 4 at 6:37
BenniBenni
473513
I see... Thank you! :) Btw, the way I tried to gather as much code as I could that has the same characteristics, that's basically what cascade method is, right? We are suppose to do it like that, correct?
– Gray
Jan 4 at 6:44
Yes, that's exactly as you should write code. There is almost never an excuse to use the same code multiple times, except perhaps in some cases for the sake of readability.
– Benni
Jan 4 at 8:22
add a comment |
You should just keep it simple and use as few breakpoints as possible to achieve the wanted results. There is no absolute maximum number for this, as more complex websites probably require more breakpoints.
This explains good practices using breakpoints well.
Mobile-first design is something one should be aware though: Create your website for small screens first, and set breakpoints as the screen gets bigger, not the other way around. This is useful, because this way you let computers, which usually have more processing power than smartphones, handle breakpoints, and smartphones can just display the site "as is", without having to calculate large amounts of breakpoints.
Read more about mobile first
answered Jan 4 at 6:37
BenniBenni
473513
I see... Thank you! :) Btw, the way I tried to gather as much code as I could that has the same characteristics, that's basically what cascade method is, right? We are suppose to do it like that, correct?
– Gray
Jan 4 at 6:44
Yes, that's exactly as you should write code. There is almost never an excuse to use the same code multiple times, except perhaps in some cases for the sake of readability.
– Benni
Jan 4 at 8:22
add a comment |
You should just keep it simple and use as few breakpoints as possible to achieve the wanted results. There is no absolute maximum number for this, as more complex websites probably require more breakpoints.
This explains good practices using breakpoints well.
Mobile-first design is something one should be aware though: Create your website for small screens first, and set breakpoints as the screen gets bigger, not the other way around. This is useful, because this way you let computers, which usually have more processing power than smartphones, handle breakpoints, and smartphones can just display the site "as is", without having to calculate large amounts of breakpoints.
Read more about mobile first
answered Jan 4 at 6:37
BenniBenni
473513
You should just keep it simple and use as few breakpoints as possible to achieve the wanted results. There is no absolute maximum number for this, as more complex websites probably require more breakpoints.
This explains good practices using breakpoints well.
Mobile-first design is something one should be aware though: Create your website for small screens first, and set breakpoints as the screen gets bigger, not the other way around. This is useful, because this way you let computers, which usually have more processing power than smartphones, handle breakpoints, and smartphones can just display the site "as is", without having to calculate large amounts of breakpoints.
Read more about mobile first
answered Jan 4 at 6:37
BenniBenni
473513
answered Jan 4 at 6:37
BenniBenni
473513
answered Jan 4 at 6:37
BenniBenni
473513
answered Jan 4 at 6:37
BenniBenni
473513
473513
I see... Thank you! :) Btw, the way I tried to gather as much code as I could that has the same characteristics, that's basically what cascade method is, right? We are suppose to do it like that, correct?
– Gray
Jan 4 at 6:44
Yes, that's exactly as you should write code. There is almost never an excuse to use the same code multiple times, except perhaps in some cases for the sake of readability.
– Benni
Jan 4 at 8:22
add a comment |
I see... Thank you! :) Btw, the way I tried to gather as much code as I could that has the same characteristics, that's basically what cascade method is, right? We are suppose to do it like that, correct?
– Gray
Jan 4 at 6:44
Yes, that's exactly as you should write code. There is almost never an excuse to use the same code multiple times, except perhaps in some cases for the sake of readability.
– Benni
Jan 4 at 8:22
I see... Thank you! :) Btw, the way I tried to gather as much code as I could that has the same characteristics, that's basically what cascade method is, right? We are suppose to do it like that, correct?
– Gray
Jan 4 at 6:44
I see... Thank you! :) Btw, the way I tried to gather as much code as I could that has the same characteristics, that's basically what cascade method is, right? We are suppose to do it like that, correct?
– Gray
Jan 4 at 6:44
Yes, that's exactly as you should write code. There is almost never an excuse to use the same code multiple times, except perhaps in some cases for the sake of readability.
– Benni
Jan 4 at 8:22
Yes, that's exactly as you should write code. There is almost never an excuse to use the same code multiple times, except perhaps in some cases for the sake of readability.
– Benni
Jan 4 at 8:22
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54034050%2fwhats-the-maximum-of-breakpoints-a-responsive-website-should-have%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
This question is either too broad, opinion based or requires discussion and so is off-topic for Stack Overflow. If you have a specific, answerable, programming issue, please provide full details.
– Paulie_D
Jan 4 at 11:10