Hi Reham Alharbi,
Apparently something is wrong with your code...
Do you see any error messages in the console of your browser? (You can open this console by pressing F12, for most modern browsers.)
In the script below I tried to replicate your app - focusing on Madinah, and with a working Search widget - all in one html file. You did split your code into separate css and js files, which is of course OK.
I suppose your issue has something to do with the order of your code.
What do you see? does the map appear at all? With or without the zoom buttons?
Please let us (the community) know whether you managed to solve your issue or not. We are here to help.
BR,
Egge-Jan
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no" />
<!--
ArcGIS API for JavaScript, https://js.arcgis.com
For more information about the search_basic sample, read the original sample description at developers.arcgis.com.
https://developers.arcgis.com/javascript/3/jssamples/search_basic.html
-->
<title>ArcGIS API for JavaScript | Basic Search</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.32/esri/themes/calcite/dijit/calcite.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.32/esri/themes/calcite/esri/esri.css">
<style>
html,
body,
#map {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
#search {
display: block;
position: absolute;
z-index: 2;
top: 20px;
left: 74px;
}
</style>
<script src="https://js.arcgis.com/3.32/"></script>
<script>
require([
"esri/map",
"esri/dijit/Search",
"dojo/domReady!"
], function (Map, Search) {
var map = new Map("map", {
basemap: "topo",
center: [39.608684, 24.469576], // lon, lat
zoom: 13
});
var search = new Search({
map: map
}, "search");
search.startup();
});
</script>
</head>
<body class="calcite">
<div id="search"></div>
<div id="map"></div>
</body>
</html>
Hi Reham Alharbi,
The only mistake is you placed your search after you ended the Require
If this has helped you resolve your issue, you could please mark this as correct answer and close the thread.