html - Button not getting re-sized while using twitter bootstrap with rails -
I'm using Ruby on Rail version 4 with Twitter Bootstrap 2 to create web applications.
I used the button to create a button which takes the user to the second page, though the styling css does not apply to it correctly. Round borders are displayed correctly, text is bold, etc. But when I resize the browser window the button can not automatically resize itself. The width of the button is constant.
However, when I
& lt;% = button_to 'Start Learning', tut ,: method = & gt; : Get,: class = & gt; 'BTN BTN-Default'% & gt;
& lt; Button class = 'btn-default' & gt; Learning Start & lt; / Button & gt; This is displayed completely, the button width is automatically resized.
Am I using button_to incorrectly?
The complete contents of index.html Erb:
& lt; Script & gt; & Lt; / Script & gt; & Lt; Body style = "background-color: # DDD4BC" & gt; & Lt; H1 align = "center" style = "background color: # 005b 9a" & gt; & Gt; Font color = "#fff" & gt; Tutorial & lt; / Font & gt; & Lt; / H1> & Lt; Br> & Lt; Br> & Lt; Style type = "text / css" & gt; .span4, .span1, .span3, .span5 {height: 200px; Border-spacing: 0; Padding: 5px; font-weight: bold; Background color: #fff; Color: # 000; Text align: center; Margin-left: 60px; Margin-right: 60px; Margin-down: 25px; Border-radius: 25px; Status: Relative; }. Title {background color: # 005b9a; Height: 40px; Line-height: 40px; Color: #fff; Font-size: 20px; Padding: 5px; Border-top-left-radius: 25px; Border-top right-radius: 25px; Text-transform: uppercase; font-weight: bold; Vertical-align: medium; } .btn-default {status: complete; Down: 5px; Top: 80%; Text-transform: uppercase; font-weight: bold; Display area; Width: 98%; Border-bottom-left-radius: 25px; Vertical-align: medium; Border-bottom right-radius: 25px; } & Lt; / Style & gt; & Lt; Div class = "container" & gt; & Lt; Div class = "row" & gt; & Lt;% @ tuts.each do Tut | | & Gt%; & Lt; Div class = "span3" & gt; & Lt; Div class = "title" & gt; & Lt;% = tut.title% & gt; & Lt; Br> & Lt; / Div & gt; & Lt;% = tut.tut_desc% & gt; & Lt; Br> & Lt;% = link_to 'Show', tut% & gt; & Lt;% = link_to 'edit', edit_tut_path (tut)%> & Lt;% = link_to 'deleted', tut, method :: delete, data: {confirm: 'are you sure?' }% & Gt; & Lt; Br> & Lt;% = button_to 'Learn to start', tut ,: method = & gt; : Get,: class = & gt; 'BTN BTN-Default'% & gt; & Lt; / Div & gt; & Lt;% end% & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Br> & Lt;% = link_to 'New Tut', new_tut_path% & gt; & Lt; / Body & gt; & Lt ;! - background-image: url ('/ assets / blacktexture.jpg'); - & gt;
Because the button to make the rail button button a form, not the button
You can use the link_to method and specify the class: "BTN BTN-Primary" (It works in Bootstrap 3, not sure how it is defined in v2)
Comments
Post a Comment