If youâve been working with a Twitter page to complete the DS106 web storytelling assignment, youâve probably run into a problem. Basically, Twitter has an interface feature that hides tweets until you scroll down to the bottom of the page. For a variety of reasons, this feature doesnât work properly when you save a local copy of the page. After a little hunting around, Iâve found a âfix.â Youâre going to need to copy and paste the following small code snippet and paste it into your coded page in your text editor. Youâll need to place it somewhere between the opening and closing head tags: <head>. . .</head>
Hereâs the snippet youâll need:
<style>
#front-container, #page-container {
overflow: visible !important;
}
</style>
What this does is overwrite a style that is in the original Twitter stylesheet, forcing the overflow of the main page container to become visible (instead of hidden as it is by default. That â!importantâ in this snippet of code is a way to tell the browser that this style should trump the default one.
Try that out and then upload your HTML file to your Web server if it works. If youâre still having difficulty, leave a comment describing what you did and what happened.
BTW, a few people have also been running into encoding problems when theyâre working on these files. Here are some encoding tips:
- If youâre working in basic Notepad, when you save the file, youâll see an option to choose an encoding for your file. Make sure you chose UTF-8.
- If youâre working in Notepad++, there is an Encoding menu. choose âUTF-8 without BOM.â
- If youâre working in TextWrangler (on the Mac), go to Edit>Document Options. In the Encoding drop-down, choose âUnicode (UTF-8, No BOM)â
Hope this helps everyone!
Add a comment