Forum Support

Shape 5
June 14, 2021, 12:38:33 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News: Shape 5 Forum
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Width of Logo for this template -> 2nd round.  (Read 639 times)
alvarix84
Jr. Member
**
Offline Offline

Posts: 9

Gravatar


« on: August 05, 2013, 01:43:31 PM »

Hi.

I have in my web a logo with a width = 396px. My problem is shown in the image.

I could solve this by adding:

Code:
#s5_logo {
   margin-left: -160px;

But in the mobile version, the logo is clipped.

You can tell me how to fix this?

Thanks very much!
Logged
mikenicoll
Global Moderator
*****
Offline Offline

Posts: 20162



WWW
« Reply #1 on: August 05, 2013, 05:56:00 PM »

Hello,

Please post a URL.

-Mike
Logged

Mike Nicoll
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
alvarix84
Jr. Member
**
Offline Offline

Posts: 9

Gravatar


« Reply #2 on: August 06, 2013, 03:12:00 AM »

Hi

The URL is http://alterlanguages.com/

Logo width is 300px.

Thanks!
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #3 on: August 06, 2013, 12:38:49 PM »

Hello,

In the mobile version I don't see the logo being clipped or cut off?  Can you post a screenshot of what you mean?
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
alvarix84
Jr. Member
**
Offline Offline

Posts: 9

Gravatar


« Reply #4 on: August 06, 2013, 01:36:26 PM »

Hello,

In the mobile version I don't see the logo being clipped or cut off?  Can you post a screenshot of what you mean?

To view the logo on the web mobile version correctly, I have to remove the code I posted above, as it is now. But if you open the website in a browser, and the header will not display correctly. This is my problem.

Thanks very much.
Logged
alvarix84
Jr. Member
**
Offline Offline

Posts: 9

Gravatar


« Reply #5 on: August 06, 2013, 02:17:14 PM »

I update for show my problem. I add a capture.

In case A, i put the code:

Code:
#s5_logo {
   margin-left: -80px;

And i get correct format in desktop version and clipped logo in mobile version (in the url this is the actual situation).

In case B, as default, i have the code:

Code:
#s5_logo {
   margin-left: 0;

And i get correct format in mobile version and 2 lines for header in the desktop version.

Please, help me.

Thanks very much.

URL: www.alterlanguages.com

PD: The dimensions of logo are 300x45 px

« Last Edit: August 06, 2013, 02:19:16 PM by alvarix84 » Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #6 on: August 07, 2013, 12:54:37 PM »

Hello,

To fix this issue just leave the code:

#s5_logo {
   margin-left: -80px;

in your css file but then add the below and this will force the mobile version to show the logo without the indent on it:


@media screen and (max-width: 579px){

#s5_logo {
   margin-left: 0 !important;
}
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
alvarix84
Jr. Member
**
Offline Offline

Posts: 9

Gravatar


« Reply #7 on: August 07, 2013, 04:37:30 PM »

Thanks very much for your help.

Finally i had to reduce logo because in some resolutions i saw the logo clipped too :s

Regards and thanks again
Alvaro
Logged
nicoleta
Jr. Member
**
Offline Offline

Posts: 4



« Reply #8 on: October 17, 2013, 03:22:49 AM »

heya, your site looks great.

I have a question though, how did you get the text in "top_row2_1" and "top_row2_2" to be so closely aligned? No matter what I do the row2-2 is slightly lower and it looks off because i'm using two images that are the same size/shape.

I noticed that it's off in the demo template as well, but it's not such an issue as the images are different/text is different.

Thanks in advance, this is very frustrating and the end result is looking very sloppy for me.
Logged
mikenicoll
Global Moderator
*****
Offline Offline

Posts: 20162



WWW
« Reply #9 on: October 17, 2013, 05:42:54 PM »

Hello,

Please create a separate post with a URL and I can take a look.

-Mike
Logged

Mike Nicoll
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Valid XHTML 1.0! Valid CSS!
Looking for the largest variety in template designs? Look no more. Never buy 1 theme again. Signups start at just $89 for access to all of our themes.
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.