Question

I noticed that after using a form in a tabledata-element of a condensed table that the rowheight is getting increased.

Refer to following screenshot of a table that contains a form (for the delete button) and a table without form: http://cl.ly/image/43272x452b2i.

How could I get rid of this extra space that gets added when using a form? I’d like to maintain the rowheight of a condensed table.

Table with only the tabledata containing the form looks like this:

<table class="table table-striped table-bordered table-condensed">
        <thead>
            <tr>
                <th></th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    @form(routes.Clubs.deleteClub(club.clubID.get), 'onsubmit -> "return confirm('Bent u zeker dat u dit club wilt verwijderen?')") {
                        @if(!permissions.contains(Clubs.CLUB_DELETE) || club.isUsed){
                            <a disabled="disabled" type="submit" class="btn"><i class="icon-remove"></i></a>
                        }else{
                            <a type="submit" class="btn"><i class="icon-remove"></i></a>
                        }
                    }
                </td>   
            </tr>
        }

    </tbody>
    </table>

I’m using Twitter Bootstrap v2.0.1.

Thanks!

Answer 1

Got it resolved, added the following block to my css:

table form{
    margin-bottom: 0px;
}