how to change the logo size

hi,

i need to change the logo size to a wider size without messing up the layout.
please help.

3 answers

Profile photo of Sherlock 0.00 $tone July 12, 2013
Public

Hi mate,

you can open the file of skin/frontend/default/jm_trex/css/theme.css there look for this css rule

HTML Code:

 h1#logo a, h1#footer-logo a {
  color: [URL=http://www.joomlart.com/forums/usertag.php?do=list&action=hash&hash=FFFFFF]#FFFFFF[/URL]
  display: block;
  font-size: 250%;
  height: 80px;
  text-decoration: none;
  text-indent: -99999px;
  width: 80px;
}

you can increase the with and height value here, after increase those value you would need to search for this rule

HTML Code:

   #topbar {
  border-left: 1px solid [URL=http://www.joomlart.com/forums/usertag.php?do=list&action=hash&hash=1C1C1C]#1C1C1C[/URL]
  float: left;
  width: 830px;
}

And here you reduce the with value accordingly .
Hope you get it

#1
Profile photo of Jeancarlos Rodriguez 270.00 $tone July 31, 2013
Public

HI sherlock,

It works, but now when i view my site through my phone it shows the logo over the top links.
I guess because we made it bigger it over laps on the mobile version.
where do i edit the size on the mobile version?

thanks

#2
Profile photo of Sherlock 0.00 $tone August 1, 2013
Public

Hi mate,

For the mobile you can open the file skin/frontend/default/jm_trex/css/layout-mobile.css and add this css rule

HTML Code:

 h1#logo a, h1#footer-logo a {
            height: 80px;
            width: 80px;
         }

I think it would help !

#3

Please login or Register to Submit Answer

Written By

Comments