How to position the select element while using Chosen?


Tags: jquery,html,css,jquery-chosen

Problem :

I'm using inputs from this question: How do I use Chosen jQuery in my html file? So I have a select box, but the problem is I'm having trouble styling the select element.I used left and top % in CSS to position it, but it does not work.How can I position and style the select element?

http://jsfiddle.net/NWD9Q/3/

A little snippet:

<select class="chzn-select" multiple="true" name="faculty" style="width:200px;">
    <option value="AC">A</option>
    <option value="AD">B</option>
    <option value="AM">C</option>
    <option value="AP">D</option>
</select>


Solution :

chzn-container will be the right class to add position and this can done in 2 ways.

  1. Adding the attribute directly in chosen.css file.
  2. Adding the attribute via jQuery as mentioned below.

$(".chzn-container").css({"left":"20%"});

DEMO in Jsfiddle.


    CSS Howto..

    How can I style external links like Wikipedia?

    How to center a child element in CSS, even if it is larger than the parent?

    How do I change the text inside a button?

    How do you create a scrolling window over a still background image with CSS?

    how to run HTML+CSS+JAVASCRIPT Project on android Emulator

    How to embed css to HTML in laravel?

    Greasemonkey: How to do something when style=“display: none;” changes?

    How to move a carousel item to the middle when it's clicked in jquery

    How can I fix the menu on the implanted header?

    How to find the css file name associated with an element?

    How to make pixel perfect font in css?

    How to arrange div as a dock panel?

    How to separate image folder and css folder to work with eachother in maven project

    How to dynamically change the style of a comma separated tags with html/css/jquery

    How do i enable hover effect on an image if the text before it is hovered?

    How to change text in the same area when hover over images with CSS?

    How to change active menu item style in html/css/js/php

    How to align elements so CSS fixed doesnt overlap on page load

    CSS layout - How to lay every box especially when sidebar is not staying in the container?

    How can I zoom this gallery without moving the other pictures?

    LESS: how to use dumpLineNumbers

    How to pause or delay animation using JavaScript/jquery

    html, css - how to use display: inline-block

    Z-index issues - How to bring a child element onto the parent's below element?

    Show/hide css class by url parameter with php

    How can I show hidden element when it has focus?

    How to auto adjust menus height according to container height

    How to generate unique css selector for DOM element?

    How to Change main menu color?

    How to add an informative popup over a given text