# Div is shown on Observable platform but not on my local page after embedded.

**URL:** <https://talk.observablehq.com/t/div-is-shown-on-observable-platform-but-not-on-my-local-page-after-embedded/4241>\
**Category:** Help\
**Created:** [November 30, 2020, 5:49am UTC](https://talk.observablehq.com/t/div-is-shown-on-observable-platform-but-not-on-my-local-page-after-embedded/4241 "2020-11-30T05:49:20Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Iris](https://avatars.discourse-cdn.com/v4/letter/i/a5b964/32.png) [@Iris](https://talk.observablehq.com/u/Iris)\
**Post date:** [November 30, 2020, 5:49am UTC](https://talk.observablehq.com/t/div-is-shown-on-observable-platform-but-not-on-my-local-page-after-embedded/4241/1 "2020-11-30T05:49:20Z")

</div>

Hello, everyone! I got a project based on the Disjoint Force-Directed Graph. Here is my code: [https://observablehq.com/@iris990314/interactivity](https://observablehq.com/@iris990314/interactivity)

I attached a detailed table for each node, and the graph is good. But after I embedded it into my local html file. The detailed table is gone. But I can see the text of the table is showing at the end of the page.

Could anyone please help? Appreciate any suggestions.

---

<div class="post-metadata">

**Author:** ![radames](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/radames/32/1699_2.png) [@radames](https://talk.observablehq.com/u/radames)\
**Post date:** [December 1, 2020, 12:22am UTC](https://talk.observablehq.com/t/div-is-shown-on-observable-platform-but-not-on-my-local-page-after-embedded/4241/2 "2020-12-01T00:22:30Z")

</div>

hi @Iris I see that your tooltip is using css styles defined on the last cell, that anonymous cell has to be referenced in other parts of your notebook or you can name that cell and select it to embed.

https://observablehq.com/embed/2d97aca6f29645ab?cell=vis&cell=styles

if you don’t want to attach that cell to your embed, you can aways add the styles direct into your code for example

```auto
    div.attr("class", "tooltip");
    div.node().style.cssText = `
        position: absolute;
        width: auto;
        height: auto;
        padding: 8px;
        background: #ddd;
        pointer-events: none;
        border: 1px solid #eee;
        border-radius: 10px;`;

```

---

<div class="post-metadata">

**Author:** ![Iris](https://avatars.discourse-cdn.com/v4/letter/i/a5b964/32.png) [@Iris](https://talk.observablehq.com/u/Iris)\
**Post date:** [December 2, 2020, 3:21pm UTC](https://talk.observablehq.com/t/div-is-shown-on-observable-platform-but-not-on-my-local-page-after-embedded/4241/3 "2020-12-02T15:21:06Z")

</div>

Hey! @radames Thank for answering. The problem is on “hover2” cell which controls the detail table appearing when the mouse hovering on the node. I do have a reference, div.attr(“class”, “tooltip”), in that cell. Just have no idea that the detail table is working on the web platform, but not on my local html after embedding.

Also I give the css cell a name, but embedding that cell is not working as well. Could you please help me to figure it out? It is my first time to use Observable.

Thank you so much.

---

<div class="post-metadata">

**Author:** ![Iris](https://avatars.discourse-cdn.com/v4/letter/i/a5b964/32.png) [@Iris](https://talk.observablehq.com/u/Iris)\
**Post date:** [December 2, 2020, 6:02pm UTC](https://talk.observablehq.com/t/div-is-shown-on-observable-platform-but-not-on-my-local-page-after-embedded/4241/4 "2020-12-02T18:02:57Z")

</div>

Sorry @radames. It works! I just figured out that I have to republish the code to see the change. Thank you so much!!
