Category Archives: Coding

One clearfix to rule them all

The concept of a clearfix didn’t really ring a bell for me until a couple of years into dedicated web work. It felt like a hack, maybe even a shortcut, and my instinct was that good old properly-syntaxed HTML and CSS would win the day.

I didn’t know what I was really talking about. Today, as we await final spec approval for Flexbox and eventual browser compatibility, we’re still in a place were block elements need to align themselves in some way.

If one doesn’t need to displace other elements, absolute positioning is always an option. But if vertical alignment needs to happen, you’re generally going to need to float something.

And that’s where a dependable clearfix can make life a lot easier.

 

Balancing the height of divs without major CSS acrobatics

My day job is currently as a front-end developer, and a design requirement recently perplexed me for quite sometime before finding an almost embarrassingly simple solution that worked across all the browsers we’re targeting.

Here’s the scenario: There’s a narrow div on the left with menu-like listings and a main div in the center. The left div has a drop-shadow on its right edge, which we’re using a tiled, 1px high png to accomplish.

The challenge is that on some iterations of the page, the left div is taller than the right and on some it’s the other way around. As coded by default, if the right div ended up taller than the left, the drop-shadow would end where the left div naturally ended, leaving a gap at the bottom.

Now, there is a pure-CSS solution to this, but after messing with it for a couple of hours and not quite getting the delicate dance of percentages and lefts, rights and hard pixel widths to play nice, I happened upon a jQuery solution that took about 40 characters of code to implement.

 $(document).ready(function(){
$(“#side”).height( $(“#main”).height() );
});

Replace the ID names of side and main  to match your own div IDs or classes. Instant success. I swear, I’m developing a very big crush on jQuery as I ferret out more things it can do to make my life easier that weren’t obvious to me up to now.

Fixing RSA Host Key Changes on a Mac

If you use an FTP or SSH client to access files on your host servers and somewhere along the way, you migrate a domain from one server to another one, you’ll become familiar with a warning message like this:

Host Key Changed for ftp.yourdomain.com

If this is the first time you’ve seen this, it can certainly put a crimp in your productivity, because it generally means you’re not getting past this point unless you remove the host key recorded on your computer for the remote host connection you’re trying to reach.

The reason this is happening is that when you initiate a remote connection for the first time, a host key record is saved as a point of reference and a security check for future connections to that same remote host.

But if you take that website you’ve worked on and move it to another server, whether you are changing hosting companies or simply moving to a different server with the same host, the fingerprint coming back from that new server won’t match the one saved from the previous server. And as a result, your FTP or SSH client won’t let you complete the connection.

But the solution is fairly simple: You just need to remove the saved host key record that’s been stored on your computer and you’ll be able to connect again.

To get to the saved host file on your Mac, you need to use the Terminal program. Once opened, you should start out and the root of your own user account on the Mac, but should you venture away from their into other parts of your file system, you can always get back to your account root with this:

cd ~

From there, we’ll want to go to the hidden directory /.ssh, or all as one command,

cd ~/.ssh

From there, you can look at the files tucked away with the SSH command ls, and should see a file called known_hosts. Use the nano edit command to open the file.

nano known_hosts

You’ll see a list of all the host records saved. If you work on a lot of sites, it could be a long list. Scroll down the list to the line representing the domain you’re having an issue with. Get your cursor to the beginning of the line below it and then backspace to clear the full line. Hit control and x and then y when prompted to confirm your changes and voila, you should be able to connect again.

Alternately, if you’ve moved many sites and zapping all those lines would prove a long and tedious task, you could choose to remove the known_hosts file completely, in which case your computer would simply regenerate it from scratch as you make new FTP connections. To do that, you’d use the ssh command rm, like this:

rm known_hosts

Either way, that should do it. Once the old host record is gone, you should be able to connect to the host on the new server without any problem.