bootstrap seven colum in a row

I'm using bootstrap and I need to create a "row" with inside seven div. It's a row containing seven custom ceckbox, one for each day of the week. this is a picture of what I'm trying to do.

I saw an example showing this is what i wrote now:

<div class="container col-md-12">
    <div class="row seven-cols col-md-12">
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
        <div class="col-md-1">
            <label class="checkbox-inline ggsettimana ggsettimanabox">
                <input type="checkbox" id="inlineCheckbox1" value="option1"> Lunedì
            </label>
        </div>
    </div>
</div>

How can I set the same size for every div and display all of them in one column?

Answers


i presume you're trying to use the grid system for this. You wont be able to, simply because 7 doesn't go into 12. You could quite easily do the css yourself, giving each div a width of 10% and give the container a margin of 15% on the left and right.

Without much detail i can't help a lot, but you don't have to strictly follow the grid. 7/5 grids don't really work. I havent used bootstrap in a while, but could you not make each div 1 wide and center it? i use foundation these days, and i know you can with that.

edit: found an example of centered columns: http://www.minimit.com/articles/solutions-tutorials/bootstrap-3-responsive-centered-columns


Need Your Help

How to implement ActiveMQ with VM's using NAS

c# .net vmware activemq nas

We're in the process of moving our .NET platform from using MSMQ to ActiveMQ. We pump 30+ million persistent messages through it a day, so throughput and capacity are critical to us. The way our ...

SEO Optimization Error, improper crawling or improper indexing

optimization indexing seo search-engine

i have a blog build in wordpress, And my domain name is like example.com (i can't give you the original name, because some times the editors will mark this question as SPAM :( , and if any one really