How to successfully change the ESRI logo in JSAPI applications?
I am writing an Esri JavaScript API application and would like to replace the Esri logo with my client's logo. I have found that using logo.med allows me to replace the logo, however, there are size dependencies in the API that I cannot change. I would like my logo size to be about 85px x 29px. Here's an example of the image that I am using which appears incorrectly at the bottom right of the map. This incorrect because the image shows up 4 times. I am using .logo-med to change the logo. How can I set the CSS so that I can use the image at any size that I prefer?
<!DOCTYPE html>
<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">
<title>Create web map from id</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.16/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.16/esri/css/esri.css">
<style>
html,
body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
background-color: #FFF;
overflow: hidden;
font-family: "Helvetica";
}
#rightPane {
background-color: #E8E8E8;
border: solid 2px #B8B8B8;
margin: 5px;
width: 20%;
}
#map {
background-color: #FFF;
border: solid 2px #B8B8B8;
margin: 5px;
padding: 0;
}
.esriLegendServiceLabel {
display: none;
}
#search {
display: block;
position: absolute;
z-index: 10px;
top: 25px;
right: 1025px;
}
.logo-med {
background-image: url('capture2.png') !important;
}
</style>
