html - How do you center text in a select drop down menu, style the drop down and add a down arrow? -
This is killing me. I have 2 menus which I need to focus on text. I have text-aligned Has tried varieties: center, margin: 0 auto, etc. I can not use padding because the names of all the elements are different sizes Any ideas?
Here the rail section of the code, which creates a select drop down.
& lt;% = Archive_sect (: id ,: name, @restaurants, id ,: name, hint: "choose a restaurant")% & gt;
The code is displayed when it is produced in HTML.
& lt; Select id = "id_name" name = "id [name]" and gt; & Lt; Option value = "" & gt; Choose a restaurant & lt; / Options & gt; & Lt; Option value = "5" & gt; Jamba & lt; / Options & gt; & Lt; Option value = "4" & gt; Smokey Joes & lt; / Options & gt; & Lt; Option value = "3" & gt; Arbis & lt; / Options & gt; & Lt; Option value = "1" & gt; McDonald's & lt; / Options & gt; & Lt; Option value = "2" & gt; Burger King & lt; / Option & gt; & Lt; / Select & gt;
Present Styling Every time I tried to make a style choice, it was nothing.
. Filter {height: auto; Margin: 0 auto; Hidden flurry; Padding-down: 10px; Width: 280px; Select {background-color: RGBA (255, 255, 255,0.71); Background: -webkit-linear-shield (below, RGBA (255,255,255,0.71) 71%, RGBA (255,255,255,0.71) 71%); Background: -O linear shield (below, RGBA (255,255,255,0.71) 71%, RGBA (255,255,255,0.71) 71%); Background: -Mo-linear-shield (below, RGBA (255,255,255,0.71) 71%, RGBA (255,255,255,0.71) 71%); Limit: 1 px solid #fff; Boundary-radius: 0; Color: # 553705; Font-size: 18px; Height: 48px; Margin-top: -4 pixel; Padding: 10px 5px; Width: 100%; -WebKit-Presence: None; & Amp;: Hover {cursor: pointer; }}}
I need to add a little drop down arrow to choose, but it is not sure whether the element should be inserted: later Here's how I would like to see the site:
< / P>
Any other ideas will also be appreciated on styling the options. Right now when I open it, it opens a little bit here, there is a picture here
Based on this feedback, you need what you need in vanilla css It is not possible to do The aforementioned posts recommend using the jQuery plugin as an option, which does not sound fun at all.
Comments
Post a Comment