[CSS] Removing white space between images

2 posts Page 1 of 1
Contributors
User avatar
smashapps
Coding Guru
Coding Guru
Posts: 961
Joined: Tue Apr 05, 2011 8:41 am

Hello,

For my course work I had to put together a website using sliced images and one problem with this is you get white space between the images.

Like this:

Image

How do we remove those annoying spaces?

We can remove the spaces using CSS we only need one line of text and it's for the img tag.
Code: Select all
img 
    {
    float: left;
    }
All we are doing is applying float left to all images. If you need it applied to specific images you can create an id or a class (classes are .something and id is #something) and then use float:left

What is float?
With CSS float, an element can be pushed to the left or right, allowing other elements to wrap around it.

Float is very often used for images, but it is also useful when working with layouts. - W3 Schools
After:


Image
My name is Tom | Visit my blog where I post new content every day! Tom's Daily Blog | MineCraft is awesome!
User avatar
Snyper345
VIP - Donator
VIP - Donator
Posts: 471
Joined: Mon Nov 01, 2010 1:53 am

Good tutorial and easy to understand, Thanks. Now I should probably work on some of my course work aswell :D
Image
Image
2 posts Page 1 of 1
Return to “Tutorials”