CODEWITHSUNDEEP
javascriptjqueryhtmlcsstwitter-bootstrap
Pink Code
Pink Code

Reputation: 1834

Bootstrap Timepicker not show in RTL

I work with RTLbootstrap. Now I add Timeticker plugin in my form. But Timeticker dropdown not show in right of input and normal width.

Problem Pic:

enter image description here

I need to like this:

enter image description here

How do Fix This?

DEMO HERE

Upvotes: 1

Views: 2972

Answers (4)

hosseinkhazaei
hosseinkhazaei

Reputation: 1

.bootstrap-datetimepicker-widget {
  list-style: none;
    direction:ltr !important;
}
.bootstrap-datetimepicker-widget.dropdown-menu {
  display: block;
  margin: 2px 0;
  padding: 4px;
  width: 17em;
 direction:ltr !important;
}

Upvotes: 0

Luba Karpenko
Luba Karpenko

Reputation: 101

Added to my css

.datetime-picker-dropdown { direction: initial !important; }

Upvotes: 0

shahin kiani
shahin kiani

Reputation: 51

this worked 100%

change style from bootstrap-timepicker.min.css or bootstrap-timepicker.css fllowing this rule on css;

 bootstrap-timepicker-widget.dropdown-menu{ padding: 4px}

change to :

    bootstrap-timepicker-widget.dropdown-menu{ padding: 4px;direction: ltr;right: auto}

Upvotes: 5

mcmac
mcmac

Reputation: 1052

change style on the following rule,

.dropdown-menu{
  right: auto;
}

to as shown below.

.dropdown-menu{
  right:0;
}

and it'll be ok.

Upvotes: 1

Related Questions