HTML content overlaying everywhere

Educators Authoring
1

Hello authors

I have been trying to display some html content in my course. But I am getting absurd output.

So I am creating a unit and under add new component I am selecting </>HTML followed by Raw HTML.

Here I enter my html code which is at the bottom of this post.

And this is how my content looks in LMS. Please help me get this right and look beautiful. Once I am able to get this working then will try to make it accessible by all devices. I am just trying to add fun elements in my course for young learners.

Screenshot_2020-06-10-12-02-17-526_com.android.chrome
Screenshot_2020-06-10-12-02-17-526_com.android.chrome720×676 103 KB

demopage.html (10.0 KB)

Could someone help me on this?

2

@Selli You probably have CSS rules in the HTML you are pasting that is interfering with the Open edX CSS. You will need to go through your pasted HTML to edit it, though that will require to be able to understand & debug CSS.

3

Hi thanks for responding I got it working by tweaking the html code and inline CSS. My position property was absolute which I changed to relative later