Using CSS to Center Vertically and Horizontally
Centering items using CSS is actually very easy. If you want to center a picture horizontally then just use the following code in your CSS file.
IMG.centered {
display: block;
margin-left: auto;
margin-right: auto;
}
What the above CSS code does is center an image between the left and right margins automatically. Whenever you insert an image just make sure to call the “centered” class, for example:
<img class=”centered” src=”/images/someimage.jpg” alt=”some text” />
If you want to center something vertically then you would need to use a container. For example:
DIV.container {
top: 0;
left: 0;
width: 100%;
height: 100%;
position: fixed;
display: table;
}
P {
display: table-cell;
vertical-align: middle;
}
Now that you have the CSS part done lets look at the HTML part.
<div class=”container”>
<p>This text is vertically centered</p>
</div>
Now lets combine both of the techniques together to have an image that is horizontally and vertically centered in a browser window.
CSS Code:
DIV.container {
top: 0;
left: 0;
width: 100%;
height: 100%;
position: fixed;
display: table;
}
P {
display: table-cell;
vertical-align: middle;
}
HTML Code:
<div class=”container”>
<p>The image below is vertically and horizontally centered.<br />
<img class=”centered” src=”images/someimage.jpg” alt=”some text” /></p>
</div>
Thats It!
Automatically Add WWW to All Your URLs
It is always a good idea to pick one format for your website URL and stick with it. If you want to make sure all your URLs have a “www” in front of them then paste the following code at the top of your “.htaccess” file.
Options +FollowSymlinks
RewriteEngine On
RewriteCond %{REQUEST_URI}\\/%{HTTP_HOST}/www. ^/+(.+/)?[^.]*[^/]\\(/)([^w][^w][^w][^.].*/(www\.)¦.*)$ [OR,NC]
RewriteCond %{HTTP_HOST}/www. ^(/)?(/)?([^w][^w][^w][^.].*/(www\.))$ [NC]
RewriteRule ^ http://%4%{HTTP_HOST}%{REQUEST_URI}%2 [L,R=301]
The above code uses the apache mod_rewrite module to rewrite your URL. It also makes sure that there is a trailing slash at the end of your URL. This website is using the above code to make sure all URLs load with a “www” and have the appropriate trailing slashes.
Prevent search engines from crawling and indexing your website
All search engines have automatic web crawlers that are constantly browsing the internet in order to keep their search results up to date. Unless you specifically configure your website to disallow them, they will eventually find you and list you in their search results.
To disallow these crawlers(robots) from crawling your website, just create a file called “robots.txt” with the following data.
User-agent: *
Disallow: /
Upload the “robots.txt” file to the root of your website and it will prevent the crawlers from crawling your website.
You can also use meta tags to prevent the robots from crawling a specific page. To do so, place the following code within the <HEAD></HEAD> tags of your html.
<meta name=”ROBOTS” content=”NOINDEX, NOFOLLOW”>
The NOINDEX keyword is telling the robots not to index the current page in their search results. The NOFOLLOW keyword is telling the robots not to follow any links on the current page.
How to get information about your php installation
When creating php programs, not only is it important to know which version of php is running on your server but also which modules are compiled with your php installation.
To check what modules are installed, simply type the following code in a php file and load the file in your browser.
phpinfo(8);
If you would like to just view the general php information such as the configuration, php.ini location, build date, and web server then you can use the following code.
phpinfo(1);
If you would like to view all of the information available about your php installation then just use the following code.
phpinfo();
This is a very quick and easy way to check and make sure that your php configuration is going to be compatible with the program you are planning to write.