pushing a div to the bottom of the screen

[stevegos]

Hi, I am using the plugin function cookie_consent (http://dev.cmsmadesimple.org/projects/cookie_consent) which places a div overlayed at the top of the screen and disappears when clicked on.

I want to be able to have it appear at the bottom of the page rather then at the top, but not at the bottom of the entire page, but overlay as it is now so it stays in the same place even when scrolling. Hope that makes sense.

The css within the function:

Code: Select all

<style type="text/css">
				#cookie_consent { 
					background-color: rgba(0,0,0,0.7);
					position: absolute;
					float: left;
					z-index: 10000000000000;
					width: 100%;
					padding: 10px 0;
				}
				#cookie_consent p {
					text-align: center;
					color: #fff;
					font-size: 16px;
					margin: 0;
					
				}
				#cookie_consent a.more_info {
					margin: 0 5px;
					color: #ccc;
					text-decoration: underline;
					cursor: pointer;
				}
				#cookie_consent a.decline_cookies {
					margin: 0 5px;
					color: #f33;
					text-decoration: underline;
					cursor: pointer;
				}
				a.page_decline_cookies {
					color: #f33;
					text-decoration: underline;
					cursor: pointer;
				}
				#cookie_consent a.accept_cookies {
					margin: 0 5px;
					color: #6c0;
					font-weight: bold;
					text-decoration: underline;
					cursor: pointer;
				}
			</style>

Any ideas? All help greatly appreciated.

Steve

[velden]

Looks like basic css to me:

Code: Select all

#cookie_consent {
               background-color: rgba(0,0,0,0.7);
               position: fixed;
               float: left;
               z-index: 10000000000000;
               width: 100%;
               padding: 10px 0;
               bottom : 0;
            }

[stevegos]

Thanks, thats worked. I tried numerous ideas but forgot about the simplicity of the bottom css attribute.