Recent
Categories
View Replies (3)

Logo resize issue on different screen

0
Votes
Undo
  1. muddasirpk
    muddasirpk
  3. Commercial Templates
  4. Monday, 20 May 2013
  5.  Subscribe via email
Check our site at http://www.canadawestla.com/

Our logo seem fine at full screen but if we small the screen the logo appears too big and overlaps home, how to solve that issue and make logo small if we small the screen or make logo responsive.
Responses (3)
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Try adding the following to the Custom CSS field of your templates parameters...

[code type=css]h1.logo a {background-size: auto auto !important;}[/code]

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 1
muddasirpk
muddasirpk
Accepted Answer Pending Moderation
0
Votes
Undo
Well, its working for large screen and for small screen fine,

But if just resize screen to some medium size at some points logo overlaps the menu, so on some computers our clients are complaining about the logo overlaps, I am attaching here picture for reference.
  1. more than a month ago
  2. Commercial Templates
  3. # 2
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
The following will replace the default top menu with the mobile menu for this screen size..


[code type=css]@media only screen and (min-width: 768px) and (max-width: 959px) {
/* Hide default hornav menu */
#hornav{display:none !important;}

/* Show mobile hornav menu */
#container_hornav_mobile{display:inline; position: absolute; z-index: 99; margin-top:13px;}

.js #mobile { display: none; }
.js .selectnav {
display: block;
-webkit-appearance: listbox;
width:100%;
padding:10px;
margin-top:-70px;
margin-bottom:40px;
border-radius: 3px;
-webkit-box-shadow: 0 5px 6px -6px b1b1b1;
-moz-box-shadow: 0 5px 6px -6px black;
box-shadow: 0 5px 6px -6px black;
border:1px solid #EDEDED;
background-color:#F9F9F9;
color:#777777;
}
}[/code]

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 3
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!