[HTML/CSS] html 에서 카카오맵 불러오기 및 가운데 정렬 (!important)

(1) 카카오맵 불러오기

• 카카오맵에서 원하는 곳을 검색합니다.

• 원하는 위치의 html태그를 복사합니다.

• 원하는 html 파일에 붙여넣습니다.

<!-- * 카카오맵 - 지도퍼가기 -->
<!-- 1. 지도 노드 -->
<div id="daumRoughmapContainer1613788870358" class="root_daum_roughmap root_daum_roughmap_landing"></div>

<!--
	2. 설치 스크립트
	* 지도 퍼가기 서비스를 2개 이상 넣을 경우, 설치 스크립트는 하나만 삽입합니다.
-->
<script charset="UTF-8" class="daum_roughmap_loader_script" src="https://ssl.daumcdn.net/dmaps/map_js_init/roughmapLoader.js"></script>

<!-- 3. 실행 스크립트 -->
<script charset="UTF-8">
	new daum.roughmap.Lander({
		"timestamp" : "1613788870358",
		"key" : "24iif",
		"mapWidth" : "640",
		"mapHeight" : "360"
	}).render();
</script>

---

(2) 카카오맵 가운데 정렬

카카오맵을 가져오는건 쉽게 해결했는데 어떤 이유에선가 <style>로 가운데 정렬 하는 코드가 적용이 안되었습니다.

현재 해결된 상태로 생각해 보면 내 html보다 카카오에서 지정한 style이 늦게 적용되어 기존 내가 작성한 html의 <style>이 덮어져 기능구현이 안되었습니다.

    .root_daum_roughmap {
        margin: auto !important;
    }

위와 같이 !important 명령어를 통해 언제 적용되는지와 관계없이 해당 코드를 실행하도록 하여 해결했습니다.

---