when working with materialize datepicker, Ive been facing an issue where the datepicker wouldn't occupy the center of the screen, while this code works on android devices, this doesn't work on a physical iPhone device.
any help would be appreciated.
Here is the code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0'
name='viewport' />
<meta name="viewport" content="width=device-width" />
<title>Kidzania Ticket Booking</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/css/materialize.css" />
</head>
<body>
<form role="form">
<div class="formGroup">
<input type="text" class="datepicker" />
</div>
</form>
<script src="assets/js/jquery-2.2.4.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/js/materialize.min.js"></script>
</body>
<script>
$('.datepicker').pickadate({
selectMonths: true, // Creates a dropdown to control month
selectYears: 15, // Creates a dropdown of 15 years to control year,
today: 'Today',
clear: 'Clear',
close: 'Ok',
closeOnSelect: false // Close upon selecting a date,
});
</script>
</html>
