Digital experiences for all disciplines
New Landing › How can we help? › Themeforest Theme Support › Dante › Responsive theme template files
New Landing › How can we help? › Themeforest Theme Support › Dante › Responsive theme template files
- This topic has 5 replies, 2 voices, and was last updated 10 years by Tahir – SUPPORT.
-
Posted in: Dante
-
January 18, 2014 at 9:29 pm #43378
Hi,
Which files and/or lines of code in other files are the ones responsible for changing the layout for different screen sizes when you select the “responsive” layout theme option?
I would like to be able to customize the theme so that it displays as it as if it were not in “responsive” mode (just shrinks everything) for all screen sizes except for the “mobile portrait” size. When I deleted all the content in “responsive.css” from the dante theme, it still seems to act like it does in the responsive mode.
Thanks!
January 20, 2014 at 6:52 am #43485Or just, how do I change the page width of the current theme? 1200 is a little large, and I would not like to use the “responsive” theme option as it doesn’t look to great on mobile.
Thanks
January 22, 2014 at 12:20 pm #44057Hi,
You could try this custom css .
@media(min-width:1200px){.container{width:970px !important} @media only screen and (min-width: 1250px) { /* LAYOUT */ #container.boxed-layout { width: 1030px !important ; } }
Let me know if you run into any issues.
Thanks
TahirJanuary 24, 2014 at 2:02 am #44412Thanks Tahir,
that seems to set the width of the <html> to my desired width of 860px when I adjust to the number of pixels that I want, but the issue doesn’t seem to be resolved.The continued issue that I am having is that when viewed on a phone or tablet screen, the width of all of my content is 860px, but the width of the screen still appears to be 1200px. So there is extra blank screen that loads to the right of all of my content. I hope this description helps you understand the issue, and thanks again for your help!
January 24, 2014 at 2:08 am #44413Another piece of info:
when I “view source” of my webpage, I find that near the top of my source code, inside the <head> tags, I get the CSS snippet that says html { min-width: 1200px; } and I can’t find where I can change this at all. Any help would be greatly appreciated, thank!
I put some of the code that was above and below to maybe give you a reference point of where this code is being registered.
<script type="text/javascript">var ajaxurl = 'http://localhost/wordpress/wp-admin/admin-ajax.php';</script> <script type="text/javascript"> var ajaxurl = 'http://localhost/wordpress/wp-admin/admin-ajax.php'; </script> <style type="text/css"> html { min-width: 1200px; } [class*="span"] { float: left; min-height: 1px; margin-left: 30px; box-sizing:content-box!important; -moz-box-sizing:content-box!important; /* Firefox */ -webkit-box-sizing:content-box!important; /* Safari */ } .sidebar { box-sizing:border-box!important; -moz-box-sizing:border-box!important; /* Firefox */ -webkit-box-sizing:border-box!important; /* Safari */ } .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { width: 1170px!important; max-width: none!important; } #header .is-sticky .sticky-header { width: 100%!important; max-width: none!important; } .span12 { width: 1170px; } .span11 { width: 1070px; }
January 27, 2014 at 12:23 pm #44986Hi,
You can simply overwrite it using this custom csshtml { min-width: 860px !important; }
Best
-Tahir -
Posted in: Dante
You must be logged in and have valid license to reply to this topic.