Change logo position in Joomla

Question

I'e been using joomla default template: Protostar. From template manager I set a logo and it appears at the left top of each page. How can I shift the logo 100px right?

I'm running joomla 3.2.1 in localhost.

Answer 1

Go to the following file:

root/templates/protostar/css/template.css

Search for the logo and edit or add the following:

#logo {
    position: relative;
    left: 100px;
}

or on line 6936, you will find the .site-title { } block, which you can replace with the following:

.site-title {
    font-size: 40px;
    font-weight: bold;
    left: 100px;
    line-height: 48px;
    position: relative;
}

In future, start getting used to your browser console and start inspecting elements. If you're using Firefox, then I would recommend using Firebug.