jasonc Posted September 15, 2017 Share Posted September 15, 2017 (edited) I have been looking via google and this forum but still no closer to finding the answer to this.I have a select that is in the right side of my page but the options are jumping out to the right side of the page. So I am looking to get the 'container' moved to the left so it is aligned to the right of the select. Edited September 15, 2017 by jasonc Quote Link to comment Share on other sites More sharing options...
jasonc Posted September 15, 2017 Author Share Posted September 15, 2017 (edited) For the sake of simplicity I have used instyle.I am wanting the right side select to have its option 'container' to be moved over to the left so it is like that in the image in my first post. <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style> .form2 { width: 200px; margin: 0 auto; padding: 0.5em 0.5em 0.5em 0.5em; } .form2 input.field { float: left; width: 100%; height: 2em; border: 0.02em solid #000; line-height: 1.7em; font-size: 0.9em; padding: 0.2em; } .form2 select { } .form2 select.field { float: left; width: 100%; height: 2em; border: 0.02em solid #000; line-height: 1.7em; font-size: 0.9em; padding: 0.2em; } </style> </head> <body> <form class="form2" id="form2" name="form2" method="post" action=""> <div style="float: left; width: 48%;"><select class="field" title="Select Stairs, Lift or N-A" name="stairliftna" id="stairliftna"><option value="Select Stairs, Lift or N-A">Select Stairs, Lift or N/A</option><option value="Stairs">Stairs</option><option value="Lift">Lift</option><option value="n-a">N/A</option></select><br><br> </div> <div style="float: left; width: 4%;"> </div> <div style="float: left; width: 48%;"><select class="field" title="Select Packing service" name="packingservice" id="packingservice"><option value="Select Packing service">Select Packing service</option><option value="Self packing">Self packing service</option><option value="Part packing">Part packing service</option><option value="Full packing service">Full packing service</option></select><br><br> </div> <br class="clearFloat"> </form> </body> </html> Edited September 15, 2017 by jasonc Quote Link to comment Share on other sites More sharing options...
Psycho Posted September 15, 2017 Share Posted September 15, 2017 (edited) That doesn't look like a "real" select, but more likely a CSS/JavaScript element. Impossible to help without you providing the relevant code. What would be really helpful is if you could create a JSFiddle with just the minimum code to replicate the problem. EDIT: OK, when I clicked Save your 2nd post wasn't there. Edited September 15, 2017 by Psycho Quote Link to comment Share on other sites More sharing options...
jasonc Posted September 15, 2017 Author Share Posted September 15, 2017 If I done a JSFiddle it would be the same code. I recreated the same problem using my original code and stripped out everything that was not needed to show my issue. The right side select is the issue. I am wanting the options 'container' to be right aligned to the select as shown in the image I added in the OP Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.