Question

I discovered Sinatra not long ago and started to translate a webform I made in html/php/css into sinatra language.

At this point, everything seems to be working great except for one thing : a span tag.

When I run my sinatra, I get the following error :

/aaa/bbb/…/views/index.haml in nil
%span.small Add your name

I have no idea why it is not working since everything in the code is working super well!

Here is a part of my CSS file (note that I removed some of the code so there won’t be a ton of it. The %h1, %p, etc, are working well!) :

body{
font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
/*text-align:center;*/
}

p, h1, form, button{border:0; margin:0; padding:0;}
.spacer{clear:both; height:1px;}

.myform{
margin:0 auto;
width:400px;
padding:14px;
}

#stylized{
border:solid 2px #b7ddf2;
background:#ebf4fb;
}

#stylized .small{
color:#666666;
display:block;
font-size:11px;
font-weight:normal;
text-align:right;
width:145px;
}

Here is the haml code

%html
  %head
    %title Website Test
    %link(rel="stylesheet" href="css/styles.css")
  %body
    #stylized.myform
      %form{ :id => "form", :name => "form", :method => "post", :action => "form1.rb"}
        %h1 Virtual Machine Form
        %p Please fill every field and then hit the submit button

        %label Name
          %span.small Add your name
        %input{ :type => "text", :name => "name", :id => "name"}

And here is the html code that is working

<div id="stylized" class="myform">
  <form id="form" name="form" method="post" action="vmform_process.php">
    <h1>Virtual Machine Form</h1>
    <p>Please fill every fields and the hit the submit button</p>

    <label>Name
      <span class="small">Add your name</span>
    </label>
    <input type="text" name="name" id="name" />
  ...
  </form>
</div>

Answer 1

You should probably include the actual error. I think your problem is that the label includes inline and nest content. It should be

%label
  Name
  %span.small Add your name