Roman priority asked 3 years ago

Hello, I have downloaded the latest version of MDB jQuery (4.8.0) and the style of datepicker on my page is different than on your website. I have only add a piece of code into index.html page from downloaded ZIP package.

Thank you for your help.

Expected behavior Big blue field with big date number (Saturday above May above 04 above 2019)

Actual behavior "Sat, May, 04" in one line

Resources (screenshots, code snippets etc.)

<!DOCTYPE html>
<html lang="en">

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title>Material Design Bootstrap</title>
  <!-- Font Awesome -->
  <link rel="stylesheet" href="">
  <!-- Bootstrap core CSS -->
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <!-- Material Design Bootstrap -->
  <link href="css/mdb.min.css" rel="stylesheet">
  <!-- Your custom styles (optional) -->
  <link href="css/style.css" rel="stylesheet">


  <!-- Start your project here-->
    <div class="md-form">
      <input placeholder="Selected date" type="text" id="date-picker-example" class="form-control datepicker">
      <label for="date-picker-example">Try me...</label>
  <!-- /Start your project here-->

  <!-- SCRIPTS -->
  <!-- JQuery -->
  <script type="text/javascript" src="js/jquery-3.4.0.min.js"></script>
  <!-- Bootstrap tooltips -->
  <script type="text/javascript" src="js/popper.min.js"></script>
  <!-- Bootstrap core JavaScript -->
  <script type="text/javascript" src="js/bootstrap.min.js"></script>
  <!-- MDB core JavaScript -->
  <script type="text/javascript" src="js/mdb.min.js"></script>
  <script type="text/javascript">



Marta Wierzbicka staff answered 3 years ago


there is a bug in our documentation. A smaller picker is correct one, we updated the design of the date picker. We will update our date picker documentation as soon as possible.

Best, Marta

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • User: Priority
  • Premium support: Yes
  • Technology: MDB jQuery
  • MDB Version: 4.7.7
  • Device: PC
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes