html - Can't get table navigation to resize just in mobile while the rest of the website does -


on mobile, navigation have @ top of website won't resize, , scale down, width of mobile screen. instead, width stays constant. else, including images , text, resizes.

my website is: https://whereshouldieat.ie/

the table's style follows:

 <table style="width: 100%; height: 100%"> 

however, width set 100%, not scale down mobile devices.

<nav class="navbar navbar-default navbar-fixed-top"> <!-- if map being displayed i.e. homepage -->         <div id="map-wrapper">         <div id="map" style="position: relative; overflow: hidden;"><div style="height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; background-color: rgb(229, 227, 223);"><div class="gm-style" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px;"><div tabindex="0" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; cursor: url(&quot;https://maps.gstatic.com/mapfiles/openhand_8_8.cur&quot;) 8 8, default;"><div style="z-index: 1; position: absolute; top: 0px; left: 0px; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0);"><div style="position: absolute; left: 0px; top: 0px; z-index: 100; width: 100%;"><div style="position: absolute; left: 0px; top: 0px; z-index: 0;"><div aria-hidden="true" style="position: absolute; left: 0px; top: 0px; z-index: 1; visibility: inherit;"><div style="width: 256px; height: 256px; position: absolute; left: 252px; top: 173px;"></div><div style="width: 256px; height: 256px; position: absolute; left: 252px; top: 429px;"></div><div style="width: 256px; height: 256px; position: absolute; left: 252px; top: -83px;"></div><div style="width: 256px; height: 256px; position: absolute; left: -4px; top: 173px;"></div><div style="width: 256px; height: 256px; position: absolute; left: -4px; top: -83px;"></div><div style="width: 256px; height: 256px; position: absolute; left: -4px; top: 429px;"></div></div></div></div><div style="position: absolute; left: 0px; top: 0px; z-index: 101; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 102; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 103; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 0;"><div aria-hidden="true" style="position: absolute; left: 0px; top: 0px; z-index: 1; visibility: inherit;"><div style="position: absolute; left: 252px; top: 173px; transition: opacity 200ms ease-out;"><img src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i15!2i15812!3i10621!4i256!2m3!1e0!2sm!3i386079896!3m14!2sen-us!3sus!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy50ojf8cy5lomwudc5mfhauyzojzmy0ndq0ndqscy50oje3fhaudjpvzmyscy50oje4fhaudjpvzmyscy50oje5fhaudjpzaw1wbglmawvklhmuddoxoxxzlmu6z3xwlny6c2ltcgxpzmllzcxzlnq6mtl8cy5lomcuznxwlny6b2zmlhmuddoxoxxzlmu6bc50fhaudjpzaw1wbglmawvklhmuddoymhxwlny6c2ltcgxpzmllzcxzlnq6mjb8cy5lomwudhxwlny6c2ltcgxpzmllzhxwlmm6i2zmymyzyjmwlhmuddoymhxzlmu6bc50lmz8cc53ojkunzn8cc52onnpbxbsawzpzwr8cc5joinmzmjmm2izmcxzlnq6mjf8cc52onnpbxbsawzpzwqscy50ojixfhmuztpnlmz8cc53ojauntv8cc52onnpbxbsawzpzwqscy50ojv8cc5joinmzmyyzjjmmixzlnq6odf8cy5lomcuznxwlnm6mhxwlmm6i2zmzmzmzmzmlhmuddoxmzezfhmuztpnlmz8cc52onnpbxbsawzpzwr8cc53ojaunjf8cc5zojascy50ojezmtr8cy5lomd8cc52om9ulhmuddoxmze0fhmuztpnlmz8cc5zojascy50ojj8cc52om9mzixzlnq6mzr8cc52om9mzixzlnq6mzz8cc52om9mzixzlnq6mzh8cc52om9mzixzlnq6mzv8cc52om9mzixzlnq6mzl8cc52om9mzixzlnq6m3xwlnm6ltewmhxwlmw6nduscy50ojq5fhaudjpzaw1wbglmawvklhmuddo1mhxzlmu6zy5mfhaudjpvbnxwlmm6i2zmm2ezytnhfhaubdo4nsxzlnq6ntb8cy5lomwudc5mfhauyzojzmyzytnhm2f8cc52om9ulhmuddo1mhxzlmu6bc5pfhaudjpvzmyscy50ojuxfhaudjpzaw1wbglmawvklhmuddo1mxxzlmu6zy5mfhauyzojzmyzytnhm2f8cc52onnpbxbsawzpzwr8cc5sojg1lhmuddo1mxxzlmu6zy5zfhauyzojzmyzytnhm2escy50ojuxfhmuztpslnquznxwlmm6i2zmm2ezytnhlhmuddo1mxxzlmu6bc50lnn8cc5joinmzmzmzmzmznxwlny6c2ltcgxpzmllzhxwlnc6mc4wmsxzlnq6ntf8cy5lomwuaxxwlny6b2zmlhmuddo0fhaudjpvzmyscy50ojz8cc5joinmzjlhztjmznxwlny6b24!4e0!5m1!5f2&amp;token=25370" draggable="false" alt="" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div><div style="position: absolute; left: 252px; top: 429px; transition: opacity 200ms ease-out;"><img src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i15!2i15812!3i10622!4i256!2m3!1e0!2sm!3i386079896!3m14!2sen-us!3sus!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy50ojf8cy5lomwudc5mfhauyzojzmy0ndq0ndqscy50oje3fhaudjpvzmyscy50oje4fhaudjpvzmyscy50oje5fhaudjpzaw1wbglmawvklhmuddoxoxxzlmu6z3xwlny6c2ltcgxpzmllzcxzlnq6mtl8cy5lomcuznxwlny6b2zmlhmuddoxoxxzlmu6bc50fhaudjpzaw1wbglmawvklhmuddoymhxwlny6c2ltcgxpzmllzcxzlnq6mjb8cy5lomwudhxwlny6c2ltcgxpzmllzhxwlmm6i2zmymyzyjmwlhmuddoymhxzlmu6bc50lmz8cc53ojkunzn8cc52onnpbxbsawzpzwr8cc5joinmzmjmm2izmcxzlnq6mjf8cc52onnpbxbsawzpzwqscy50ojixfhmuztpnlmz8cc53ojauntv8cc52onnpbxbsawzpzwqscy50ojv8cc5joinmzmyyzjjmmixzlnq6odf8cy5lomcuznxwlnm6mhxwlmm6i2zmzmzmzmzmlhmuddoxmzezfhmuztpnlmz8cc52onnpbxbsawzpzwr8cc53ojaunjf8cc5zojascy50ojezmtr8cy5lomd8cc52om9ulhmuddoxmze0fhmuztpnlmz8cc5zojascy50ojj8cc52om9mzixzlnq6mzr8cc52om9mzixzlnq6mzz8cc52om9mzixzlnq6mzh8cc52om9mzixzlnq6mzv8cc52om9mzixzlnq6mzl8cc52om9mzixzlnq6m3xwlnm6ltewmhxwlmw6nduscy50ojq5fhaudjpzaw1wbglmawvklhmuddo1mhxzlmu6zy5mfhaudjpvbnxwlmm6i2zmm2ezytnhfhaubdo4nsxzlnq6ntb8cy5lomwudc5mfhauyzojzmyzytnhm2f8cc52om9ulhmuddo1mhxzlmu6bc5pfhaudjpvzmyscy50ojuxfhaudjpzaw1wbglmawvklhmuddo1mxxzlmu6zy5mfhauyzojzmyzytnhm2f8cc52onnpbxbsawzpzwr8cc5sojg1lhmuddo1mxxzlmu6zy5zfhauyzojzmyzytnhm2escy50ojuxfhmuztpslnquznxwlmm6i2zmm2ezytnhlhmuddo1mxxzlmu6bc50lnn8cc5joinmzmzmzmzmznxwlny6c2ltcgxpzmllzhxwlnc6mc4wmsxzlnq6ntf8cy5lomwuaxxwlny6b2zmlhmuddo0fhaudjpvzmyscy50ojz8cc5joinmzjlhztjmznxwlny6b24!4e0!5m1!5f2&amp;token=126878" draggable="false" alt="" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div><div style="position: absolute; left: -4px; top: 173px; transition: opacity 200ms ease-out;"><img src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i15!2i15811!3i10621!4i256!2m3!1e0!2sm!3i386079896!3m14!2sen-us!3sus!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy50ojf8cy5lomwudc5mfhauyzojzmy0ndq0ndqscy50oje3fhaudjpvzmyscy50oje4fhaudjpvzmyscy50oje5fhaudjpzaw1wbglmawvklhmuddoxoxxzlmu6z3xwlny6c2ltcgxpzmllzcxzlnq6mtl8cy5lomcuznxwlny6b2zmlhmuddoxoxxzlmu6bc50fhaudjpzaw1wbglmawvklhmuddoymhxwlny6c2ltcgxpzmllzcxzlnq6mjb8cy5lomwudhxwlny6c2ltcgxpzmllzhxwlmm6i2zmymyzyjmwlhmuddoymhxzlmu6bc50lmz8cc53ojkunzn8cc52onnpbxbsawzpzwr8cc5joinmzmjmm2izmcxzlnq6mjf8cc52onnpbxbsawzpzwqscy50ojixfhmuztpnlmz8cc53ojauntv8cc52onnpbxbsawzpzwqscy50ojv8cc5joinmzmyyzjjmmixzlnq6odf8cy5lomcuznxwlnm6mhxwlmm6i2zmzmzmzmzmlhmuddoxmzezfhmuztpnlmz8cc52onnpbxbsawzpzwr8cc53ojaunjf8cc5zojascy50ojezmtr8cy5lomd8cc52om9ulhmuddoxmze0fhmuztpnlmz8cc5zojascy50ojj8cc52om9mzixzlnq6mzr8cc52om9mzixzlnq6mzz8cc52om9mzixzlnq6mzh8cc52om9mzixzlnq6mzv8cc52om9mzixzlnq6mzl8cc52om9mzixzlnq6m3xwlnm6ltewmhxwlmw6nduscy50ojq5fhaudjpzaw1wbglmawvklhmuddo1mhxzlmu6zy5mfhaudjpvbnxwlmm6i2zmm2ezytnhfhaubdo4nsxzlnq6ntb8cy5lomwudc5mfhauyzojzmyzytnhm2f8cc52om9ulhmuddo1mhxzlmu6bc5pfhaudjpvzmyscy50ojuxfhaudjpzaw1wbglmawvklhmuddo1mxxzlmu6zy5mfhauyzojzmyzytnhm2f8cc52onnpbxbsawzpzwr8cc5sojg1lhmuddo1mxxzlmu6zy5zfhauyzojzmyzytnhm2escy50ojuxfhmuztpslnquznxwlmm6i2zmm2ezytnhlhmuddo1mxxzlmu6bc50lnn8cc5joinmzmzmzmzmznxwlny6c2ltcgxpzmllzhxwlnc6mc4wmsxzlnq6ntf8cy5lomwuaxxwlny6b2zmlhmuddo0fhaudjpvzmyscy50ojz8cc5joinmzjlhztjmznxwlny6b24!4e0!5m1!5f2&amp;token=16746" draggable="false" alt="" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div><div style="position: absolute; left: -4px; top: -83px; transition: opacity 200ms ease-out;"><img src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i15!2i15811!3i10620!4i256!2m3!1e0!2sm!3i386079896!3m14!2sen-us!3sus!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy50ojf8cy5lomwudc5mfhauyzojzmy0ndq0ndqscy50oje3fhaudjpvzmyscy50oje4fhaudjpvzmyscy50oje5fhaudjpzaw1wbglmawvklhmuddoxoxxzlmu6z3xwlny6c2ltcgxpzmllzcxzlnq6mtl8cy5lomcuznxwlny6b2zmlhmuddoxoxxzlmu6bc50fhaudjpzaw1wbglmawvklhmuddoymhxwlny6c2ltcgxpzmllzcxzlnq6mjb8cy5lomwudhxwlny6c2ltcgxpzmllzhxwlmm6i2zmymyzyjmwlhmuddoymhxzlmu6bc50lmz8cc53ojkunzn8cc52onnpbxbsawzpzwr8cc5joinmzmjmm2izmcxzlnq6mjf8cc52onnpbxbsawzpzwqscy50ojixfhmuztpnlmz8cc53ojauntv8cc52onnpbxbsawzpzwqscy50ojv8cc5joinmzmyyzjjmmixzlnq6odf8cy5lomcuznxwlnm6mhxwlmm6i2zmzmzmzmzmlhmuddoxmzezfhmuztpnlmz8cc52onnpbxbsawzpzwr8cc53ojaunjf8cc5zojascy50ojezmtr8cy5lomd8cc52om9ulhmuddoxmze0fhmuztpnlmz8cc5zojascy50ojj8cc52om9mzixzlnq6mzr8cc52om9mzixzlnq6mzz8cc52om9mzixzlnq6mzh8cc52om9mzixzlnq6mzv8cc52om9mzixzlnq6mzl8cc52om9mzixzlnq6m3xwlnm6ltewmhxwlmw6nduscy50ojq5fhaudjpzaw1wbglmawvklhmuddo1mhxzlmu6zy5mfhaudjpvbnxwlmm6i2zmm2ezytnhfhaubdo4nsxzlnq6ntb8cy5lomwudc5mfhauyzojzmyzytnhm2f8cc52om9ulhmuddo1mhxzlmu6bc5pfhaudjpvzmyscy50ojuxfhaudjpzaw1wbglmawvklhmuddo1mxxzlmu6zy5mfhauyzojzmyzytnhm2f8cc52onnpbxbsawzpzwr8cc5sojg1lhmuddo1mxxzlmu6zy5zfhauyzojzmyzytnhm2escy50ojuxfhmuztpslnquznxwlmm6i2zmm2ezytnhlhmuddo1mxxzlmu6bc50lnn8cc5joinmzmzmzmzmznxwlny6c2ltcgxpzmllzhxwlnc6mc4wmsxzlnq6ntf8cy5lomwuaxxwlny6b2zmlhmuddo0fhaudjpvzmyscy50ojz8cc5joinmzjlhztjmznxwlny6b24!4e0!5m1!5f2&amp;token=46309" draggable="false" alt="" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div><div style="position: absolute; left: -4px; top: 429px; transition: opacity 200ms ease-out;"><img src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i15!2i15811!3i10622!4i256!2m3!1e0!2sm!3i386079896!3m14!2sen-us!3sus!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy50ojf8cy5lomwudc5mfhauyzojzmy0ndq0ndqscy50oje3fhaudjpvzmyscy50oje4fhaudjpvzmyscy50oje5fhaudjpzaw1wbglmawvklhmuddoxoxxzlmu6z3xwlny6c2ltcgxpzmllzcxzlnq6mtl8cy5lomcuznxwlny6b2zmlhmuddoxoxxzlmu6bc50fhaudjpzaw1wbglmawvklhmuddoymhxwlny6c2ltcgxpzmllzcxzlnq6mjb8cy5lomwudhxwlny6c2ltcgxpzmllzhxwlmm6i2zmymyzyjmwlhmuddoymhxzlmu6bc50lmz8cc53ojkunzn8cc52onnpbxbsawzpzwr8cc5joinmzmjmm2izmcxzlnq6mjf8cc52onnpbxbsawzpzwqscy50ojixfhmuztpnlmz8cc53ojauntv8cc52onnpbxbsawzpzwqscy50ojv8cc5joinmzmyyzjjmmixzlnq6odf8cy5lomcuznxwlnm6mhxwlmm6i2zmzmzmzmzmlhmuddoxmzezfhmuztpnlmz8cc52onnpbxbsawzpzwr8cc53ojaunjf8cc5zojascy50ojezmtr8cy5lomd8cc52om9ulhmuddoxmze0fhmuztpnlmz8cc5zojascy50ojj8cc52om9mzixzlnq6mzr8cc52om9mzixzlnq6mzz8cc52om9mzixzlnq6mzh8cc52om9mzixzlnq6mzv8cc52om9mzixzlnq6mzl8cc52om9mzixzlnq6m3xwlnm6ltewmhxwlmw6nduscy50ojq5fhaudjpzaw1wbglmawvklhmuddo1mhxzlmu6zy5mfhaudjpvbnxwlmm6i2zmm2ezytnhfhaubdo4nsxzlnq6ntb8cy5lomwudc5mfhauyzojzmyzytnhm2f8cc52om9ulhmuddo1mhxzlmu6bc5pfhaudjpvzmyscy50ojuxfhaudjpzaw1wbglmawvklhmuddo1mxxzlmu6zy5mfhauyzojzmyzytnhm2f8cc52onnpbxbsawzpzwr8cc5sojg1lhmuddo1mxxzlmu6zy5zfhauyzojzmyzytnhm2escy50ojuxfhmuztpslnquznxwlmm6i2zmm2ezytnhlhmuddo1mxxzlmu6bc50lnn8cc5joinmzmzmzmzmznxwlny6c2ltcgxpzmllzhxwlnc6mc4wmsxzlnq6ntf8cy5lomwuaxxwlny6b2zmlhmuddo0fhaudjpvzmyscy50ojz8cc5joinmzjlhztjmznxwlny6b24!4e0!5m1!5f2&amp;token=118254" draggable="false" alt="" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div><div style="position: absolute; left: 252px; top: -83px; transition: opacity 200ms ease-out;"><img src="https://maps.googleapis.com/maps/vt?pb=!1m5!1m4!1i15!2i15812!3i10620!4i256!2m3!1e0!2sm!3i386079896!3m14!2sen-us!3sus!5e18!12m1!1e68!12m3!1e37!2m1!1ssmartmaps!12m4!1e26!2m2!1sstyles!2zcy50ojf8cy5lomwudc5mfhauyzojzmy0ndq0ndqscy50oje3fhaudjpvzmyscy50oje4fhaudjpvzmyscy50oje5fhaudjpzaw1wbglmawvklhmuddoxoxxzlmu6z3xwlny6c2ltcgxpzmllzcxzlnq6mtl8cy5lomcuznxwlny6b2zmlhmuddoxoxxzlmu6bc50fhaudjpzaw1wbglmawvklhmuddoymhxwlny6c2ltcgxpzmllzcxzlnq6mjb8cy5lomwudhxwlny6c2ltcgxpzmllzhxwlmm6i2zmymyzyjmwlhmuddoymhxzlmu6bc50lmz8cc53ojkunzn8cc52onnpbxbsawzpzwr8cc5joinmzmjmm2izmcxzlnq6mjf8cc52onnpbxbsawzpzwqscy50ojixfhmuztpnlmz8cc53ojauntv8cc52onnpbxbsawzpzwqscy50ojv8cc5joinmzmyyzjjmmixzlnq6odf8cy5lomcuznxwlnm6mhxwlmm6i2zmzmzmzmzmlhmuddoxmzezfhmuztpnlmz8cc52onnpbxbsawzpzwr8cc53ojaunjf8cc5zojascy50ojezmtr8cy5lomd8cc52om9ulhmuddoxmze0fhmuztpnlmz8cc5zojascy50ojj8cc52om9mzixzlnq6mzr8cc52om9mzixzlnq6mzz8cc52om9mzixzlnq6mzh8cc52om9mzixzlnq6mzv8cc52om9mzixzlnq6mzl8cc52om9mzixzlnq6m3xwlnm6ltewmhxwlmw6nduscy50ojq5fhaudjpzaw1wbglmawvklhmuddo1mhxzlmu6zy5mfhaudjpvbnxwlmm6i2zmm2ezytnhfhaubdo4nsxzlnq6ntb8cy5lomwudc5mfhauyzojzmyzytnhm2f8cc52om9ulhmuddo1mhxzlmu6bc5pfhaudjpvzmyscy50ojuxfhaudjpzaw1wbglmawvklhmuddo1mxxzlmu6zy5mfhauyzojzmyzytnhm2f8cc52onnpbxbsawzpzwr8cc5sojg1lhmuddo1mxxzlmu6zy5zfhauyzojzmyzytnhm2escy50ojuxfhmuztpslnquznxwlmm6i2zmm2ezytnhlhmuddo1mxxzlmu6bc50lnn8cc5joinmzmzmzmzmznxwlny6c2ltcgxpzmllzhxwlnc6mc4wmsxzlnq6ntf8cy5lomwuaxxwlny6b2zmlhmuddo0fhaudjpvzmyscy50ojz8cc5joinmzjlhztjmznxwlny6b24!4e0!5m1!5f2&amp;token=54933" draggable="false" alt="" style="width: 256px; height: 256px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div></div></div></div><div class="gm-style-pbc" style="z-index: 2; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px; opacity: 0;"><p class="gm-style-pbt"></p></div><div style="z-index: 3; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px;"><div style="z-index: 1; position: absolute; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; left: 0px; top: 0px;"></div></div><div style="z-index: 4; position: absolute; top: 0px; left: 0px; width: 100%; transform-origin: 0px 0px 0px; transform: matrix(1, 0, 0, 1, 0, 0);"><div style="position: absolute; left: 0px; top: 0px; z-index: 104; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 105; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 106; width: 100%;"></div><div style="position: absolute; left: 0px; top: 0px; z-index: 107; width: 100%;"></div></div></div><div style="margin-left: 5px; margin-right: 5px; z-index: 1000000; position: absolute; left: 0px; bottom: 0px;"><a target="_blank" href="https://maps.google.com/maps?ll=53.348579,-6.28726&amp;z=15&amp;hl=en-us&amp;gl=us&amp;mapclient=apiv3" title="click see area on google maps" style="position: static; overflow: visible; float: none; display: inline;"><div style="width: 66px; height: 26px; cursor: pointer;"><img src="https://maps.gstatic.com/mapfiles/api-3/images/google_white5_hdpi.png" draggable="false" style="position: absolute; left: 0px; top: 0px; width: 66px; height: 26px; user-select: none; border: 0px; padding: 0px; margin: 0px;"></div></a></div><div style="background-color: white; padding: 15px 21px; border: 1px solid rgb(171, 171, 171); font-family: roboto, arial, sans-serif; color: rgb(34, 34, 34); box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 16px; z-index: 10000002; display: none; width: 256px; height: 148px; position: absolute; left: 30px; top: 160px;"><div style="padding: 0px 0px 10px; font-size: 16px;">map data</div><div style="font-size: 13px;">map data ©2017 google</div><div style="width: 13px; height: 13px; overflow: hidden; position: absolute; opacity: 0.7; right: 12px; top: 12px; z-index: 10000; cursor: pointer;"><img src="https://maps.gstatic.com/mapfiles/api-3/images/mapcnt6.png" draggable="false" style="position: absolute; left: -2px; top: -336px; width: 59px; height: 492px; user-select: none; border: 0px; padding: 0px; margin: 0px; max-width: none;"></div></div><div class="gmnoprint" style="z-index: 1000001; position: absolute; right: 80px; bottom: 0px; width: 134px;"><div draggable="false" class="gm-style-cc" style="user-select: none; height: 14px; line-height: 14px;"><div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;"><div style="width: 1px;"></div><div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div></div><div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: roboto, arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a style="color: rgb(68, 68, 68); text-decoration: none; cursor: pointer; display: none;">map data</a><span style="">map data ©2017 google</span></div></div></div><div class="gmnoscreen" style="position: absolute; right: 0px; bottom: 0px;"><div style="font-family: roboto, arial, sans-serif; font-size: 11px; color: rgb(68, 68, 68); direction: ltr; text-align: right; background-color: rgb(245, 245, 245);">map data ©2017 google</div></div><div class="gmnoprint gm-style-cc" draggable="false" style="z-index: 1000001; user-select: none; height: 14px; line-height: 14px; position: absolute; right: 0px; bottom: 0px;"><div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;"><div style="width: 1px;"></div><div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div></div><div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: roboto, arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a href="https://www.google.com/intl/en-us_us/help/terms_maps.html" target="_blank" style="text-decoration: none; cursor: pointer; color: rgb(68, 68, 68);">terms of use</a></div></div><div style="cursor: pointer; width: 25px; height: 25px; overflow: hidden; display: none; margin: 10px 14px; position: absolute; top: 0px; right: 0px;"><img src="https://maps.gstatic.com/mapfiles/api-3/images/sv9.png" draggable="false" class="gm-fullscreen-control" style="position: absolute; left: -52px; top: -86px; width: 164px; height: 175px; user-select: none; border: 0px; padding: 0px; margin: 0px;"></div><div draggable="false" class="gm-style-cc" style="user-select: none; height: 14px; line-height: 14px; display: none; position: absolute; right: 0px; bottom: 0px;"><div style="opacity: 0.7; width: 100%; height: 100%; position: absolute;"><div style="width: 1px;"></div><div style="background-color: rgb(245, 245, 245); width: auto; height: 100%; margin-left: 1px;"></div></div><div style="position: relative; padding-right: 6px; padding-left: 6px; font-family: roboto, arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); white-space: nowrap; direction: ltr; text-align: right; vertical-align: middle; display: inline-block;"><a target="_new" title="report errors in road map or imagery google" href="https://www.google.com/maps/@53.348579,-6.2872604,15z/data=!10m1!1e1!12b1?source=apiv3&amp;rapsrc=apiv3" style="font-family: roboto, arial, sans-serif; font-size: 10px; color: rgb(68, 68, 68); text-decoration: none; position: relative;">report map error</a></div></div></div></div></div>         <div class="overlay">             <div id="load" style="visibility:hidden;"></div>             <table style="width: 100%; height: 100%">                 <tbody><tr>                     <td colspan="3" class="location">location</td>                 </tr>                 <tr class="location-choices">                     <td class="choice1"><a href="#" class="choice1 btn">near me</a></td>                     <td class="choice2"><a href="#" class="choice1 btn">choose location</a></td>                     <td class="choice3"><a href="#" class="choice3 btn">anywhere</a></td>                 </tr>             </tbody></table>         </div>     </div>     <div class="container">     <div class="navbar-header page-scroll">         <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">             <span class="sr-only">toggle navigation</span>             <span class="icon-bar"></span>             <span class="icon-bar"></span>             <span class="icon-bar"></span>         </button>                    <div class="collapse navbar-collapse navbar-fixed-top" id="bs-example-navbar-collapse-1">             <ul class="nav navbar-nav navbar-center">                 <li class="hidden">                     <a href="#page-top"></a>                 </li>                 <li class="page-scroll">                     <a href="https://whereshouldieat.ie/" class="header-button map">what eat</a>                 </li>                 <li class="page-scroll">                     <a href="https://whereshouldieat.ie/#about" class="header-button map">about</a>                 </li>                 <!-- logo -->                 <li class="page-scroll">                     <a class="navbar-brand" href="https://whereshouldieat.ie/" title="where should eat?">                         <img id="navbar-logo" src="assets/img/logo/wsiewhite.png">                     </a>                 </li>                 <li class="hidden">                     <a href="#page-top"></a>                 </li>                 <li class="page-scroll">                     <a href="https://whereshouldieat.ie/#contact" class="header-button map">contact</a>                 </li><li class="changepage" data-toggle="changepage" data-target="#mymodal">                     <a href="https://whereshouldieat.ie/content/" class="header-button map">blog</a>                 </li>             </ul>         </div>     </div> </div> 

the fonts using on overlay large fixed size, causes table cells stretch.

change font sizes use scalable measure vw, em, % etc.


Comments

Popular posts from this blog

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Replicate keyboard event with html button -

javascript - Web audio api 5.1 surround example not working in firefox -