NewSourceMedia Blog » CSS

CSS Center Web Page Using Styles Sheets

admin — Thu, 19 Nov 2009 14:43:08 +0000

How to center a fixed box container using CSS? The sample below dose a few things. First it centers all body content using the body tag text-align center attribute. This is done to fix a bug in IE and other browsers that do not support margin auto styles. Next thing it will do is take your div with an id of "container" and auto center the margin with a width of 900 pixels. You can change the width to match your content as needed. Lastly it will reset the text to align left. You can align the text as you see fit but here we just wanted to make sure it set back to the default Firefox & Safari text alignment. Place the following code in your styles tag.

body
{
text-align: center;
}

div#container { margin-left: auto; margin-right: auto; width: 900px; text-align: left; }

Change CSS A HREF Link Styles

admin — Sun, 23 Dec 2007 00:22:11 +0000

How to change hyperlink color styles Question: How do I change hyperlink color style of my html links? Answer: You can do this by adding CSS to your web page. Try the following to change the a href tages:

a:link is the links color a:visited is the color for all links clicked a:hover is the link style when your mouse hovers over the link. A:active is the color when the link is active. If you just want to make a simple color change to all your web links, just do:

In other words, all links should be #0099ff or what ever color you chose regardless if you’ve visited or are hovering over a link or not.

CSS Center Background Image

admin — Sun, 23 Dec 2007 00:22:11 +0000

How to center background images on web page. Question: How do I center the backgournd image on my web page so then when I change the window size, the image stays center under the content? Answer: Try using CSS (Cascading Style Sheets) to manage your background images. The key is the “background-position:top center;”. This will do the trick. See below for an example.

Note: Make sure to change the above "bg.jpg" to your background image path.

CSS Shadow Text Effects

admin — Fri, 29 Dec 2006 00:22:11 +0000

Add cool shadows effects to your text using css codes Add cool shadows effects to your text using css codes to make the text more readable. Here is an example of light blue text with dark soft shadow. <style type="text/css"> … Continue reading →