Skip to main content

Posts

Showing posts with the label CSS

Change selection background and color using css

It is always nice to have a cool UI for our website. Changing the background and foreground color of selection can do wonders sometimes. In this post I will show you how you can achieve that. We can do this easily using CSS3. It provides us with ::selection selector. Safari supports ::selection and firefox supports   ::-moz-selection.  Webkit browsers supports ::-webkit-selection. With time many browsers have started supporting ::selection itself. .content::selection  {     background: #E01624;     color:White; } .content::-moz-selection  {      background: #E01624;      color:White; } .content::-webkit-selection {      background: #E01624;      color:White; } .content {       overflow:hidden; } In HTML I have div with class as content. 

How to center a DIV

Now a days I am learning web technologies and want to share whatever I learn. The basic idea is to make my learning available to others and have them all at same place. I hope that it will be of some use to you all. Why we need to center a DIV? You must have seen few websites which have a centered layout. They will not span the whole computer screen. This is a really attractive and efficient design technique. It is quite soothing in looks and also it helps creating a site for almost all screen resolutions. e.g. www.w3schools.com . Real work Lets start the real work. We will be using HTML and CSS to achieve this. Say you have a DIV as a parent control of your content. You want the content to be centered on the page. < DIV id="divSiteBody"> ... ... ... < /DIV> In your CSS style this DIV as: #divSiteBody { width:800px; margin:auto; } or you can style as: #divSiteBody { width:800px; margin-left:auto; margin-right:auto; } You can choose "width...