Training

"Winners make choices,
losers make excuses."
Decide to be a Winner!!!!

Free eBooks - General web design , accessibility, usability, and CSS and (X)HTML
Content Management Systems (CMS)
Google Tools

± Useful Utilities

± Programming

Javascript
- noscript - when javascript is not enabled
Perl/CGI
PHP
MySQL
XML

± Advanced Programming

Accepting Credit Cards
Microsoft Vista Cookies
FavIcon - The icon beside the title in the browser
Foreign Languages
Translators
Game Development
.htaccess - custom error messages and protect folders with passwords
Icons
Regular Expressions - Regx - used for search and replace in PHP and Perl
SSI Server Side Includes
Web Development

± Microsoft Office Products

Microsoft Office Alternatives - alternatives to purchasing Microsoft Office
File Sharing
Templates
MS Word
MS Excel
MS Power Point

± Computer Maintenance

± Other

Web Design

NOTE: This is a collection of information and links collected over the years that might provide useful information. A Safer Company LLC does not guarantee, endorse or approve any of these links or their scripts. Use these links to other websites at your own risk.

WARNING: Many features of this website require JavaScript. You appear to have JavaScript disabled or running a non-JavaScript capable web browser.

To get the best experience, please enable JavaScript or download a newer web browser such as Internet Explorer 8, Firefox, Safari, or Google Chrome.

Notice: Undefined variable: message in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/webdesign/4_Physical_Design/Coding_CSS/css_floating_image.html on line 250

Notice: Undefined variable: message in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/webdesign/Templates/code/dir_listing_enhanced.php on line 67

Notice: Undefined variable: message in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/webdesign/Templates/code/dir_listing_enhanced.php on line 72

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Notice: Undefined variable: print_file_data in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/webdesign/Templates/code/dir_listing_enhanced.php on line 127

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Warning: Use of undefined constant r - assumed 'r' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/code/F_get_page_title_Enh.php on line 28

Notice: Undefined variable: print_folder_data in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/webdesign/Templates/code/dir_listing_enhanced.php on line 160

Notice: Undefined variable: message in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/webdesign/Templates/code/WebDesign_toc.php on line 12

Notice: Undefined variable: message in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/webdesign/4_Physical_Design/Coding_CSS/css_floating_image.html on line 263

CSS Floating Image

Using CSS, you can set up an image or text in a division and css with a fixed position. The fixed position will always be in the exact location. For example: look at the top and you will see the A Safer Company logo displayed in a black box. When you scroll down, the image and box will remain in the exact location. It can be annoying since it can cover up text that you may be trying to read.

Example:

Wrap the section that you want to float in a <div id="floatsection"> </div>

<div id="floatsection">
	<img src="/images/ASC - no background copy2.gif" alt="asc" width="100" height="87" />
</div>

Set up the following css to give the division a fixed position:

<style type="text/css">
<!--
#floatsection{ 
	display:block; 
	position:fixed; 
	z-index:10; 
	width:120px;
	padding: 10px;
	top: 250px; 
	background-color:#000;
	color:#FFF;
}
-->
</style>

asc

Scroll down to see what this image does.

top of page

Warning: Use of undefined constant PHP_SELF - assumed 'PHP_SELF' (this will throw an Error in a future version of PHP) in /hermes/walnacweb03/walnacweb03af/b1896/as.asaferco/webdesign/4_Physical_Design/Coding_CSS/css_floating_image.html on line 306

Page last updated: May 31, 2012 14:25 PM

It is all about:
Content and Navigation...