Padding in .container #3169

Closed
ezersky opened this Issue Apr 20, 2012 · 22 comments

Projects

None yet
@ezersky
ezersky commented Apr 20, 2012

Solved:

.container {
min-width: 960px;
padding: 10px;
}

Owner
mdo commented Apr 20, 2012

What exactly does this solve?

ShaunR commented Apr 23, 2012

I think what he's trying to do is add padding on a container so that the child elements dont touch the container. I know i've done this for pages where you have a background color but want the container to be white (for example: http://www.beachcitiesmaid.com/). The problem I found with doing this was with responsive. It's not taking into account that extra padding that was added so the scroll bar will pop up before resizing the elements. Not really a bug though since this is custom, I would however like to see a padding option for container in the future that would make responsive play nice. Maybe some type of contianer-padded class that simply added a 15px padding? This would also mean that if page-header was the first child of container that it's margin-top would need to be set to 0;

Just some thoughts, maybe i'm going about this wrong?

ezersky commented Apr 23, 2012

ShaunR, it's right, thank you!

Owner
mdo commented Apr 24, 2012

Ah, gotcha. We won't be making this change then as it heavily alters our grid approach. Not for a 2.x release, but we'll bear it in mind for 3.0.

@mdo mdo closed this Apr 24, 2012

I've run into this issue mostly with flash messages as they're typically used in the container.

it sounds like this is a major use of any container to add a padding to it. I think this should have been there from v1

itkin commented Sep 27, 2012

+1

c33s commented Nov 11, 2012

+1
pages like http://www.beachcitiesmaid.com/ are also quite common, such a feature would also be more than useful for me. currently it is allways a decision between creating the design the customer want or being responsive. in most cases the customer want both...
i really think this feature is a must.

chhuang commented Nov 13, 2012

+1

Please add in a padded option either for the container or the spans.

+1 bump

+1 for me as well...

This seems to be a problem with a purely fixed framework. All of the other features in bootstrap are great. But, I think the grid system needs to be re-evaluated. Adding padding to the overall container is common place. But doing it in this situation completely destroys the grid system rendering it useless...

Why not have the option of having a fixed width container with the .span elements using percentages?

This issue is major to me and could cause me to consider other frameworks which I am not thrilled about.

nlsdvl commented Feb 19, 2013

+1

@ghost
ghost commented Mar 5, 2013

+1

lanami commented Mar 6, 2013

+1
voting for this feature in 3.0

To me this is a major issue as well. I do not see a nice way to add paddings to the container without breaking the grid, so I have to go into heavy customizations or sacrifice responsiveness. The framework overall is terrific, but grid system limits type of designs I can use it for.

+1

I've ended up adding padding to elements inside columns in order to not break the grid 😕

adis-me commented Mar 19, 2013

+1 Would be a nice addition.

+1, I'm just having this problem

@c33s c33s referenced this issue Apr 16, 2013
Merged

WIP: Bootstrap 3 #6342

120 of 126 tasks complete

Has anyone come up with a scalable solution? No idea if this is the best approach, but like others, I find myself adding another container within the containers with a class of 'liner' and then add padding to liner. Generally speaking, it works, but there are still scattered challenges/issues with this approach.

+1. Padding in containers works fine for most content, but then you run into issues with the automatic scaling of images. Internet Explorer fails, but do so other browsers intermittently.

Hello everyone. Think I got a solution to this problem.

Have a look and let me know what you think. Let me know if it accomplishes what you're looking for.

http://blog.davedennis.me/code/adding-padding-to-twitter-bootstrap-container

c33s commented May 6, 2013

@DaveDennisME thanks for your efforts finding a solution, but mainly this topic is about having this feature without a hack. native support would be appreciated.

also it would be helpful having also the option to use the following layout:

layout3

@jcb91 jcb91 added a commit to jcb91/jupyter_contrib_nbextensions that referenced this issue Dec 31, 2015
@jcb91 jcb91 in `nbextensions/config`:
 * add css fix for twitter bootstrap shortcoming which resulted in unwanted horizontal scroll at some resolutions (see twbs/bootstrap#3169)
bfa5d83
@jcb91 jcb91 added a commit to jcb91/jupyter_contrib_nbextensions that referenced this issue Dec 31, 2015
@jcb91 jcb91 in `nbextensions/config`:
 * add css fix for twitter bootstrap shortcoming which resulted in unwanted horizontal scroll at some resolutions (see twbs/bootstrap#3169)
89ff1f3
@jcb91 jcb91 referenced this issue in ipython-contrib/jupyter_contrib_nbextensions Dec 31, 2015
Merged

various updates for config: #444

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment