css - How do I make these buttons inline? HTML ActionLink or Html.BeginForm issues -
i'm trying make these buttons display next each other, i'm guessing want inline-block style there space between them. have tried add display: inline , display: inline-block (not @ same time) #being-survey-btn, no luck there. i've attempted add properties .btn no luck there either. i've tried putting <span> tags around of (inside divs) putting <span> tags around <button> tags , i've come nothing. using bootstrap.
my cshtml:
<div id="finish-survey-container"> <div id="finish-survey-items"> @using (html.beginform("makepdf", "habitatmanagement")) { <button id="begin-survey-btn" class="btn btn-default btn-lg" type="submit">save pdf</button> } @if (viewbag.type == "habitat management") { using (html.beginform("index", "habitatmanagement", new { userid = viewbag.userid })) { <button id="begin-survey-btn" class="btn btn-default btn-lg" type="submit">finish</button> } } </div> </div> i have attempted styling through actionlink (this how had before trying out html.beginform syntax):
@html.actionlink("save pdf", "makepdf", null, new { @id="begin-survey-btn", @class = "btn btn-default btn-lg", @style = "display: inline-block"}) i know must missing rather obvious. have idea?
edit
generated html:
<div id="finish-survey-container"> <div id="finish-survey-items"> <form action="/habitatmanagement/makepdf" method="post"> <button id="begin-survey-btn" class="btn btn-default btn-lg" type="submit">save pdf</button> </form> <form action="habitatmanagement?userid=#" method="post"> <button id="begin-survey-btn" class="btn btn-default btn-lg" type="submit">finish</button> </form> </div> </div>
each html.beginform creates form element, code end this
<form> <button>..</button> </form> <form> <button>..</button> </form> your problem form elements default block. need fix, , should set these form elements display:inline-block
something like
#finish-survey-items form{display:inline-block;} 
Comments
Post a Comment