31:[{"id":"eba1760d593d67030cacf42bd003ab3aa9548f41c96b4535de07e483c1ca5d8f819042b3b48edb392f6d8bf33d55e9a0471ef346c98f28b3de11a7f8062faa00","href":"https://static.observableusercontent.com/files/eba1760d593d67030cacf42bd003ab3aa9548f41c96b4535de07e483c1ca5d8f819042b3b48edb392f6d8bf33d55e9a0471ef346c98f28b3de11a7f8062faa00","name":"Screen Shot 2021-05-27 at 12.33.05 PM.png","type":"image/png","lastModified":1622133189893.418,"size":3988},{"id":"47b79d6791937612d99a47a4cea9a7e5229fc8c8a0985440df1ee01fb4093423de150bb2e1867313bc332efed160552468a37a2ce7b8c1511fc5db86e4ffa372","href":"https://static.observableusercontent.com/files/47b79d6791937612d99a47a4cea9a7e5229fc8c8a0985440df1ee01fb4093423de150bb2e1867313bc332efed160552468a37a2ce7b8c1511fc5db86e4ffa372","name":"Screen Shot 2021-05-27 at 12.32.18 PM.png","type":"image/png","lastModified":1622133154009.863,"size":3729}] 2f:{"title":"Overlapping Border Issue (Solved!)","cells":[{"id":0,"value":"# Overlapping Border Issue (Solved!)\nI'm having an issue where table borders overlap my tooltips, but only in the most recent version of chrome (Version 91.0.4472.77 (Official Build) (arm64)). As an example, hover over one of the taller bars on the bottom table:\n\nSolution:\n- Needed to be wrapped in a div with `position:relative;`","pinned":false,"hidden":false,"mode":"md"},{"id":16,"value":"\n \n \n \n \n \n \n

${Histogram(data, \"bill_depth\")}

","pinned":false,"hidden":false,"mode":"html"},{"id":32,"value":"The border overlaps the hover in Chrome","pinned":false,"hidden":false,"mode":"md"},{"id":29,"value":"FileAttachment(\"Screen Shot 2021-05-27 at 12.32.18 PM.png\").image()","pinned":false,"hidden":false,"mode":"ojs"},{"id":39,"value":"But not in Safari...","pinned":false,"hidden":false,"mode":"md"},{"id":36,"value":"FileAttachment(\"Screen Shot 2021-05-27 at 12.33.05 PM.png\").image()","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"import { data } from \"@observablehq/plot-exploration-penguins\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":5,"value":"import { addTooltips } from \"@mkfreeman/plot-tooltip\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":12,"value":"Histogram = (data, col, color = \"#d3d3d3\") => {\n return addTooltips(\n Plot.plot({\n height: 100,\n width: 240,\n style: {\n display: \"inline-block\"\n },\n\n marks: [\n Plot.rectY(\n data,\n Plot.binX(\n { y: \"count\", title: (elems) => `${elems.length} rows` },\n { x: col, fill: \"black\" }\n )\n )\n ],\n style: {\n overflow: \"visible\"\n }\n }),\n { opacity: 1, fill: color }\n );\n}","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}