Web Development

Dear GHoST 61…

29 July 2010

Thank you GHoST61 for hacking the index.html of all of my websites. I’m actually not mad at you for this. Quite the opposite really. You’ve done a very simple hack that was, for the most part, non-destructive. In fact, you’ve taught me 2 very valuable lessons. The first is that I should always backup the content of my server to my harddrive. Fortunately, of all the sites I have, only 2 needed to have the homepage reloaded. The second lesson is that I need to more tightly secure my server. If it was that easy for you to hack in, who knows what else could have been done by someone with more malicious intent than your own.

So, you’ve been hit by GHoST61, what do you do now? All that’s happened is that your index.html file has been changed. If you didn’t have an index.html file but rather an index.htm, index.php, etc, then all you have to do is delete the 24byte index.html file and your other index file will take back over and you’re fine. If you did have an index.html file and he overwrote yours, then you will have to re-upload (hope you keep a backup on your computer) your index.html to your server.

The next thing you have to do is secure your server. Below are some sites where people have mentioned how they fixed their stuff:
http://www.kisaso.com/technology/hacked-by-ghost61-my-blog-got-hacked/
http://www.webhostingtalk.com/showthread.php?t=948590&page=2
http://codex.wordpress.org/Hardening_WordPress

CSS – Creating a Footer

2 July 2010

Much like my last post, I could never get my footer to stay at the bottom of my main content area without hard coding it at the bottom of each page. This time I figured it out based off of something else I was researching. So again, with only 1 CSS ID selector, I’m able to keep my footer in the same place on every page, no matter how much content is there. Here is how it works:

This is the CSS part (your numbers may vary, of course):

#container {position: absolute; min-height: 600px;}
#footer {position: absolute; bottom: -10px; left: 50px;}

This is the HTML part:

<div id="container"> Your content here.
<div id="footer"> Footer here </div>
</div>

Basically, we’re setting the position to absolute so that it stays where you tell it to. The ‘min-height’ attribute allows the container to scale with the content. Because you put the #footer inside the #container div and you set it to be positioned at the bottom, it will always stay at the bottom of the #container div, no matter how far down it scales.

 

CSS – min-height attribute

2 July 2010

I’ve been working with CSS for a while on my websites but one thing always plagued me; I couldn’t get the height of my page to scale with my content automatically. I always had to write a separate ID selector for each page set to a fixed height. I don’t know why I never just google’d it, but for some reason, 6 websites later, I did. It wasn’t rocket science, it was a simple

    #container {min-height:###px;}.

Once I set the min-height, no matter how much content I added, it scaled to fit. Presto! Problem solved and lots of time saved. Make sure that any content you put in here is set to position: relative; not absolute. If it’s absolute, then the container won’t scale.