0

I'm working with an ASP.NET page that has a number of dropDownList controls. I'm trying to apply formatting so I can fit it into a small panel without the longer named list items blowing out the control. I applied a % width to them, which fixes the problem of it fitting, but then the control gets misaligned. Trying to figure out how to get the display to go to the left if there isn't any more room on the other side of the control.enter image description here

Here's the drop down:

 <asp:DropDownList ID="ddlDownloadsSector" AutoPostBack="true" CssClass="ddlstyle" EnableViewState="true" OnSelectedIndexChanged="ddlDownloadsSector_SelectedIndexChanged" runat="server" />

and here's the style:

 .ddlstyle { width: 35% }
Improve this question
4
  • 4
    Its better if you could share the HTML and CSS, Making things easier to understand. Commented Sep 12, 2016 at 16:40
  • Is this really C# ASP.NET related thing? I can't see any connection, especially to C# programming language. Commented Sep 12, 2016 at 16:48
  • Kumar, there isn't a whole lot to show here, that's what I have. Al, seriously, was that comment even worth the time it took to type it? Commented Sep 12, 2016 at 17:14
  • @TrevorGoodchild The rendered HTML is what Kumar is looking for. View Source on the page in a browser and copy the HTML (for the dropdownlist only, preferably) and paste it here. That said, if it's rendering a <select> element, your options for formatting will be limited. You may need to look into using a UI framework like jQuery UI, Bootstrap, Kendo, etc.. Commented Sep 12, 2016 at 17:19

1 Answer 1

Reset to default
2

Formatting dropdowns in HTML is a pain (and usually not recommended IIRC) because each browser handles them differently. I do not believe that you can do text wrapping within the dropdowns; even if it is possible, I can imagine there would be some issues between browsers. If you can, I would shorten the content in the dropdown that is causing the issue. If you really have to have the distinction, make a javascript event that displays a new dropdown with the distinguishing feature.

EDIT: As Mike points out in his comment, you could use some UI framework to get around this, but I think that if you are just using plain CSS/HTML/JS, then your options are limited.

Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Yeah, I'm in kind of a box here. This is a Sharepoint solution which makes it even more of a headache. Will see if I can get away with shortening the content in the dropdown. Thanks for the input.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.