Public Forums 71,145 posts

[billrust Friend billrustJoin date: March 2011Posts: 121Downloads:35Uploads:13 Thanks: 15 Thanked: 3 times in 1 posts]

#680951

I have read several threads on this, and tried a few things, but nothing here addresses my specific problem.

I want my site to be a max of 916px wide in the desktop view. When I use .css in the custom.css file, it screws up the responsive views.

To make the site look right with my custom width and custom module position widths I have this in custom.css (currently commented out so mobile views work.)

.container {width: 916px;}
.col-md-9 {width: 66%}
.col-md-3 {width: 34%}

But when I have that active, and go into the mobile (responsive) views, the site is too wide on my phone and tablet, and the breaks do not happen like they are supposed to.

So if I have the above code active the desktop view looks right, but mobile is wrong. Inactive and mobile is right, but the desktop view is wrong.

Site URL – dev.dialysistech.net (add http:// to beginning of that domain.)

Thanks,
Bill

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#681362

Hi Bill,

If you already take a look at other threads, you will see that there are suggestions to change in LESS file for width of template. In case that you’re more familiar with CSS and want to apply above code to desktop view only, you can use media query to add css for specific screen resolution. Something like:

@media (min-width: 992px) {
/* your custom code goes here */
.....
}


[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#747299

Hi Bill,

If you already take a look at other threads, you will see that there are suggestions to change in LESS file for width of template. In case that you’re more familiar with CSS and want to apply above code to desktop view only, you can use media query to add css for specific screen resolution. Something like:

@media (min-width: 992px) {
/* your custom code goes here */
.....
}


[billrust Friend billrustJoin date: March 2011Posts: 121Downloads:35Uploads:13 Thanks: 15 Thanked: 3 times in 1 posts]

#681552

<em>@Saguaros 490188 wrote:</em><blockquote>Hi Bill,

If you already take a look at other threads, you will see that there are suggestions to change in LESS file for width of template. In case that you’re more familiar with CSS and want to apply above code to desktop view only, you can use media query to add css for specific screen resolution. Something like:

@media (min-width: 992px) {
/* your custom code goes here */
.....
}

</blockquote>

I had tried that, many ways, and it did not work. It either had no affect on the desktop view, or it conflicted with my other media queries. I ended up just removing all of the code and talked Client into having a wider site with a different image rotator.

Thanks,
Bill

[billrust Friend billrustJoin date: March 2011Posts: 121Downloads:35Uploads:13 Thanks: 15 Thanked: 3 times in 1 posts]

#747415

<em>@Saguaros 490188 wrote:</em><blockquote>Hi Bill,

If you already take a look at other threads, you will see that there are suggestions to change in LESS file for width of template. In case that you’re more familiar with CSS and want to apply above code to desktop view only, you can use media query to add css for specific screen resolution. Something like:

@media (min-width: 992px) {
/* your custom code goes here */
.....
}

</blockquote>

I had tried that, many ways, and it did not work. It either had no affect on the desktop view, or it conflicted with my other media queries. I ended up just removing all of the code and talked Client into having a wider site with a different image rotator.

Thanks,
Bill

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#681582

Alright! and let me know if you need any further helps.

Have a nice day!!!

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#747445

Alright! and let me know if you need any further helps.

Have a nice day!!!

[Author]

Posts