Solved

Bootstrap

Posted on 2013-11-08
1
541 Views
Last Modified: 2013-11-10
Am used bootstrap frame work on my website. but i have problem  with  using div [width]
size. Basically bootstrap have  fixed width and sizes[like div id="span 3"] 220 px;
But i need more than that 250 px; if i give span 3 is 250 px the boost trap indicate error

check my link and give a solution to  div alignment problem

http://design.jnj.net.in/bloom/
0
Comment
Question by:jnj_web_solutions
1 Comment
 
LVL 52

Accepted Solution

by:
Scott Fell,  EE MVE earned 500 total points
ID: 39633218
Bootstrap uses 12 columns.  You are using version 2 and version 3 is the newest.  If you are just starting your project, I would switch.  Version 3 http://getbootstrap.com/ or version 2 http://getbootstrap.com/2.3.2/

First thing you should do is check your code in the validator. You have a lot of errors. Many are duplicate ID's.  Judging by your question, you are probably getting confused on how to use an ID vs CLASS.  First look here:
http://validator.w3.org/check?uri=http%3A%2F%2Fdesign.jnj.net.in%2Fbloom%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

The coding errors shown above matters in order to make your site behave the way you expect.  In your question you show, div id="span 3".  That should be a class div class="span3"

For the code, if you look on their example for version 2 http://getbootstrap.com/2.3.2/scaffolding.html you want to use the class=span throughout your code. I don't see where you have done that in your own code.  You only have bootstrap span classes in a couple of places.  

The example below is in percentages because it uses the class row-fluid.  If you don't use row-fluid, then you will be  using fixed widths.  
<div class="row-fluid">
  <div class="span12">
    Fluid 12
    <div class="row-fluid">
      <div class="span6">
        Fluid 6
        <div class="row-fluid">
          <div class="span6">Fluid 6</div>
          <div class="span6">Fluid 6</div>
        </div>
      </div>
      <div class="span6">Fluid 6</div>
    </div>
  </div>
</div>

Open in new window


I did find bootstrap2 a little confusing, if you go to version3, the classes are set up differently but I like the site up much better.

I hope this helps.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
What is a Lightbox? A Lightbox is the effect you see when you click, for example, an image and the screen fades out and up pops the same image but in its full size dimensions. There are lots of Lightbox effects for jQuery. Problem is they are a…
In this fourth video of the Xpdf series, we discuss and demonstrate the PDFinfo utility, which retrieves the contents of a PDF's Info Dictionary, as well as some other information, including the page count. We show how to isolate the page count in a…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

863 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

23 Experts available now in Live!

Get 1:1 Help Now