Joomla Templates Club 406,261 posts

[slayyne Friend slayyneJoin date: February 2014Posts: 14Downloads:0Uploads:1 Thanked: 1 times in 1 posts]

#194535

Could anyone help me out with some .css?

I made a full sized banner logo for my site and I would like for it to resize with the page. Here is my current css in the custom.css file:

.logo h1, .logo h1 a {
display: inline-block;
line-height: 1;
margin: 0;
margin-left: 11px;
}

.logo-image a {
background-image: url("/templates/ja_mitius/images/logo.jpg");
background-size: 100% 100%;
width: 1025px; /*Change with your width */
height: 125px; /*Change with your height*/

}

my url is: bigskyrpg.com

Thanks in advance for any help!

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#521542

Hi

You need to set for which screen width it needs to resize

@media (min-width: 768px) and (max-width: 979px) {logo h1, .logo h1 a {
display: inline-block;
line-height: 1;
margin: 0;
margin-left: 11px;
}

.logo-image a {
background-image: url("/templates/ja_mitius/images/logo.jpg");
background-size: 100% 100%;
width: 1025px; /*Change with your width */
height: 125px; /*Change with your height*/

}
}

[slayyne Friend slayyneJoin date: February 2014Posts: 14Downloads:0Uploads:1 Thanked: 1 times in 1 posts]

#521544

What if the user minimizes the window..right now the logo stays the same size. It shrinks the logo great on mobile, but if I resize the browser window it stays the same size.

[pavit Moderator pavitJoin date: September 2007Posts: 15749Downloads:199Uploads:2274 Thanks: 417 Thanked: 4028 times in 3778 posts]

#521549

Take a look at this file templatesja_mitiuscssbootstrap-responsive.css

What you need to do is to set all the possible behaviour of logo when the screen is resized , in your custom css
For any of these instances
@media (min-width: 768px) and (max-width: 979px) { @media (max-width: 767px) { @media (min-width: 1200px) {

[slayyne Friend slayyneJoin date: February 2014Posts: 14Downloads:0Uploads:1 Thanked: 1 times in 1 posts]

#521561

ok thanks for the help!

[Author]

Posts