last day (14 days later) » 

10:14 AM
0
Q: Why is my form inside my bootstrap modal col-md-6 by default?

MickI'm building a website and tried to embed a form as a partial view inside a modal window. I succeeded in getting the form inside the modal, but it only appears on the left half of the modal body. Does anyone know a fix for this? I never set the col-md-6 anywhere so there i no reason for it to ap...

 
Offhand, it doesnt look like your <form role="form"> has a closing tag like </form>, try adding that first
 
@Nofel the whole page including the modal is loaded inside a container. See the last code example. Is it still required that i place a container inside the modal-body?
@DelightedD0D Whoops! Accidentally did not include the closing tag in the post. However, in my code i do have it. Unfortunately that's not the problem
 
Show us the actual rendered html from "inspect element"
Something else is happening in your render, my guess would be invalid html somewhere, but we cant know till we see the rendered html, this fiddle jsfiddle.net/vgLcndpf/21 shows that the html you show here works fine
 
This here is all of the rendered html. pastebin.com/xDmE3sR9
 
Your rendered html also appears to be fine: jsfiddle.net/vgLcndpf/23 are you certain that you dont have some CSS rule affecting this modal body? like {width:50%} somewhere?
 
10:14 AM
@DelightedD0D I am 100% sure. I just started this project and only created 1 custom css file, which contains 2 lines: make the mouse a pointer when it hovers over a table row. That's seriously the only custom css i created.
 
what version of bootstrap are you using? as you can see in the fiddle, it works fine, there must be something different in your actual project
 
@DelightedD0D it's v3.3.7 (which is the defaul for a fresh asp.net mvc project)
@DelightedD0D as you see in this picture it seems to be at full width? weird prntscr.com/f05wds It also looks like it adds a margin prntscr.com/f05wtp
Good idea
 
Try opening up that form group
hover over the input itself the same way
 
I did in the second picture
 
ah
do the same for the label
 
Ok, back to the input, but scroll the right side css panel all the way up
 
Woahh
I just found it
 
It's the max-width
 
css affecting that element ;)
 
10:20 AM
This is peculiar tbh, this is just a css file that's shipped with the default bootstrap in an asp.net mvc project
Anyways, thankss tons for your help kind stranger!
It's appreciated
 
no worries, it says its coming from "site.css" which must be some extra css that project adds by default or somethin, def not from the bootstrap css prntscr.com/f05zq2
:) happy you got it sorted though :)
 
yeahh just fixed it up :)

http://prntscr.com/f060c9
Indeed it seems that visual studio adds this. I have never experienced this though, might be something new in visual studio 2017
 
could well be, the comment seems pretty clear someone there didnt like the defaults lol
 
Hahaha clearly
Anyways, thanks man :) Have a nice day
 

last day (14 days later) »