Is there a way I can apply the same styling I apply to the form (image below) so that it lines up? The map view is loading a web map with the JavaScript API. If there is more information you need let me know.
Solved! Go to Solution.
Found a solution to my own question in this thread: https://community.esri.com/thread/178086
When you say line up what do you want to happen?
I want the map to line up with the form elements that are above it. The map is inside the bootstrap container (the same as all other elements on the page), but when I set the width to 100%, it takes it as 100% of the screen size, rather than the space it is supposed to fill.
Can you share the webapp URL? Have you tried using the dev tools to play with the css to find what you are looking for?
https://developers.google.com/web/tools/chrome-devtools
I have tried playing around with the CSS in dev tools, but can't seem to find the right style to tweak. Unfortunately the web app is not hosted at the moment, but here is the HTML/CSS/JS that I have set if that helps:
Is it possible i am loading the div with map before the rest of the HTML has loaded?
You have tried changing this?
Yes, when I change the width to 100%, the map goes off the page, as it is trying to take up 100% of the screen width, rather than the container it is in. See below for a visual/
It seems like it knows where to start, just not where to end (in terms of lining up with the elements above it)
Found a solution to my own question in this thread: https://community.esri.com/thread/178086