Bootstrap - what am I doing wrong?

HTML & CSS
1

Hi,

I’ve done several sites using Bootstrap - but for some reason I just can’t get this one going!

<!DOCTYPE html>
<html lang="en">
  <head>

	<title>My Site</title>

    <meta name="description" content="">
    <meta name="author" content="">
	<meta charset="utf-8">
	
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet">
	<link href="./bootstrap/css/bootstrap-responsive.min.css" rel="stylesheet">

  </head>

  <body>
    <br /><br /><br />
	<div class="container" style="background: orange;">

		<div id="row-fluid">

			<div style="background:yellow"  class="span4" >
				foo
			</div>
			<div style="background:red" class="span4" >
				bar
			</div>
			<div style="background:blue" class="span4">
				fff
			</div>
		</div>

	</div>

	<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
	<script src="./bootstrap/js/bootstrap.min.js"></script>	

  </body>
</html>

For some reason it shows up with the 3rd box on the next line… which normally means you’ve tried to make it too wide (but 12 spans is the correct amount).

If I change one of them to span3 it works ok (but then I’m obviously left with a gap)

Anyone got any ideas? My computers gonna go out the window in a minute otherwise - it makes no sense :mad:

2

Eugh - stupid moment - found it!

I was using id=“row-fluid”… not class=“row-fluid”

Serves me right trying to work before my coffee!!!

3

We all have those :slight_smile:

Glad you sorted it yourself and thanks for the follow up.

4

haha some more than other (i.e me! ;))