Need A Little Help Creating 404 With GIF Background
解決
Hi folks,
There's a custom error page that I created in my Wordpress mockup that didn't get migrated into HubSpot 😕 I think it's fairly simple, but it's apparently something I need a little assistance with.
It's not a HUGE priority, but I would love to have this little "easter egg" feature added to our new HubSpot site. Am I close? Can anyone bump me in the right direction?
Need A Little Help Creating 404 With GIF Background
解決
This will absolutely work, but might I add another suggestion?
The parent div (module-group) is not resepecting the height of its children elements because they are floated columns. applying the Clearfix hack to the parent divs might achieve the desired look in a way that won't push the footer out of view on larger displays.
Also, I figured out why the CSS wasn't styling my content...I hadn't linked the stylesheets. And once I linked the stylesheets, I saw some conflicts. So I made a copy of my main stylesheet and created a derivative for just this error page. I also edited the GIF in the background so it's darker and allows the text to be clearly seen. I couldn't get a CSS overlay to work.
I think the look is about right. All I need to do configure this so it's used as the main 404 error page. If you have any other suggestions, please let me know.
Need A Little Help Creating 404 With GIF Background
解決
That seems to work! It works on IE/Firefox/Chrome at different sizes so I don't think there should be any issues.
Aside from darkening the GIF, one thing I often do is add some text-shadow. Not loads but a subtle amount that helps the text stand out. Something like:
Need A Little Help Creating 404 With GIF Background
解決
This will absolutely work, but might I add another suggestion?
The parent div (module-group) is not resepecting the height of its children elements because they are floated columns. applying the Clearfix hack to the parent divs might achieve the desired look in a way that won't push the footer out of view on larger displays.