Posts Tagged with "css"

CSS rounded corners

Posted by Stanislav Furman on February 26, 2012

Basic approach and main idea

Very often, web designers use CSS rounded corners to make websites nicer. This blog uses rounded corners too. You could use different methods to create rounded corners on your web site, but from my point of view the simplest one of these methods is the method that uses CSS3.

Unfortunately, this method won't work in IE (what a surprise!), but, fortunately, there is a hack exists that can fix this problem.

For most of web browsers the following code will work:

#container {
  width: 200px;
  height: 200px;
  background-color: #cccccc;	
.rounded {
  -moz-border-radius: 10px; /* Works in Firefox */
  -webkit-border-radius: 10px; /* Works in Safari, Chrome */
  border-radius: 10px; /* It's CSS3 */

<div id="container" class="rounded"></div>
Continue reading

CSS Centering Trick: How to center a div or an image?

Posted by Stanislav Furman on February 15, 2012

From time to time we create HTML/CSS templates where we need to center a div or an image. For some newbies it poses a problem. In this blog post I'll show you one of the ways of CSS centering.

Suppose you have a div or an image (with the size 150px X 100px) that should be centered on the web page. First step you do is the following CSS:

centered {
  position:  fixed;
  top:  50%;
  left:  50%;

CSS Centering Trick (image 1)

Continue reading