Site no longer responsive

Hi,

your site resizes fine if i go to https://www.thejunos.co.uk/bracebridge/, so it look like there is a problem with including the site in an iframe on https://www.bracebridgemusic.co.uk.
Better redirect https://www.bracebridgemusic.co.uk to https://www.thejunos.co.uk/bracebridge/.

Problems with this? Try removing it to test if it works:

@media (max-width: 979px){
    .nav-collapse, .nav-collapse.collapse .nav{
        display: none;
    }
    .nav-collapse, .nav-collapse.collapse.in .nav{
        display: block;
    }
}

@media (max-width: 979px){ .nav.nav li>ul{display: none;}} ?

(btw, small world – I live in Sutton Coldfield!)

Thanks Martonno, that’s a great help…!

Have taken the framed redirect off and it works fine now ??

Shame though, as it looks a bit odd with my other site’s name in the address bar!

Thanks again,

Rog

The url in the adress bar depends on how you redirect.
In your hosts url config you should be able to point https://www.bracebridgemusic.co.uk. directly to https://www.thejunos.co.uk/bracebridge/, as this would show https://www.bracebridgemusic.co.uk in the addressbar

BTW: Some subpages don’t resize properly (e.g: after-school-band-club)
On those pages you have included some images with a fixed width like 587px, which messes up the layout on phones like iphone 5 width a width of 320px. Just change the width to % or use CSS Media Queries if you need different sizes depending on the device-width.

And some of the imags can not be found:

(index):GET https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/02/dorka-002.jpg 404 (Not Found)
(index):314 GET https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/02/file2221298131057.jpg 404 (Not Found)
(index):300 GET https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/02/file0001621707015-e1435048505569.jpg 404 (Not Found)

Thanks guys,

Site is nowhere near finished TBF, hence missing graphics etc…

Martonno – Good point on the fixed widths of the images messing-up the resizing, I had tried the % before, but it made the images tiny on mobile in comparison with the text (which didn’t resize comparatively). I’m guessing there is a way to either;

1. state a minimum image size to resize to or…
2. adjust the size of the text for different size screens?

I’m a complete blagger when it comes to web design, I tend to throw things together using the brilliant code snippets guys like you provide…!

rdellconsulting – it is indeed a small world!

ideally, if I could set the images to be 100% when going below 980px width that would be ideal, any ideas…?

The easiest would be to change the code a little.
Remove all unneccessary style parameters, use wordpress defined classes for default image positioning and add a custom class (customimage ) to every image, till you get something like this:

<div style="width: 100%;">
<img class="customimage alignright wp-image-199 size-full" title="Bass Guitar Lessons Sutton Coldfield" src="https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/07/bass-banner-copy.jpg" alt="Bass Guitar Lessons Sutton Coldfield" width="587" height="440">
<h1 style="text-align: left;">Bass Guitar Lessons</h1>
<h1 style="text-align: left;">Sutton Coldfield</h1>
<h2><span style="color: #c41010;">All Styles – Rock, Blues, Jazz, Classical…</span></h2>
</div>
<div style="clear: both;">
<div style="width: 100%;">
<img class="customimage alignleft wp-image-194" title="bass guitar tuition sutton coldfield" src="https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/07/bass-1-copy.jpg" alt="bass guitar tuition sutton coldfield">
<div>
<h3>Take the First Step to Learning?an Instrument with our Private Bass Guitar Tuition Programmes…</h3>
<p>Learning an instrument is a rewarding experience! Whether you want to learn the bass guitar for fun, or begin your journey through graded exams we can help. Our bass guitar tutors are all hugely experienced professionals, fully qualified and seasoned teachers. All styles are accommodated and we can assist you through either the classical <em>Trinity</em> or <em>ABRSM</em> syllabuses or the more contemporary <em>Rock School</em> grades.</p>
</div>
<div style="clear: both;">
<img class="customimage alignright wp-image-55 size-full" title="bass guitar teacher sutton coldfield" src="https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/07/bass-2-copy.jpg" alt="bass guitar teacher sutton coldfield" width="440" height="294">
<div style="display: block; margin-left: auto; margin-right: auto;">
<h3 style="text-align: left;">The Service, Costs, and Other Information…</h3>
<p>Bass guitar lessons cost ￡25 for 45 minutes, include?all learning materials?and we will travel to you anywhere in the Sutton Coldfield area. Alternatively you can take advantage of our online lessons via Skype and receive a 10% discount. Just call 01675 475403 for more information.</p>
<div style="clear: both;"></div>
</div>
</div>
</div>
</div>
</div>

and add the following css

/* set default width for all images */
img.customimage {
  width: 440px;
}

/* center images if display-width is below 980px */
@media (max-width: 979px){
  img.customimage {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}

Okay, this should work better…

<div style="clear: both;">
<img class="customimage alignright wp-image-199 size-full" title="Bass Guitar Lessons Sutton Coldfield" src="https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/07/bass-banner-copy.jpg" alt="Bass Guitar Lessons Sutton Coldfield" width="587" height="440" />
<div>
<h1 style="text-align: left;">Bass Guitar Lessons</h1>
<h1 style="text-align: left;">Sutton Coldfield</h1>
<h2><span style="color: #c41010;">All Styles – Rock, Blues, Jazz, Classical…</span></h2>
</div>
</div>

<div style="clear: both;">
<img class="customimage alignleft wp-image-194" title="bass guitar tuition sutton coldfield" src="https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/07/bass-1-copy.jpg" alt="bass guitar tuition sutton coldfield" />
<div>
<h3>Take the First Step to Learning an Instrument with our Private Bass Guitar Tuition Programmes…</h3>
Learning an instrument is a rewarding experience! Whether you want to learn the bass guitar for fun, or begin your journey through graded exams we can help. Our bass guitar tutors are all hugely experienced professionals, fully qualified and seasoned teachers. All styles are accommodated and we can assist you through either the classical <em>Trinity</em> or <em>ABRSM</em> syllabuses or the more contemporary <em>Rock School</em> grades.
</div>
</div>

<div style="clear: both;">
<img class="customimage alignright wp-image-55 size-full" title="bass guitar teacher sutton coldfield" src="https://www.thejunos.co.uk/bracebridge/wp-content/uploads/2015/07/bass-2-copy.jpg" alt="bass guitar teacher sutton coldfield" width="440" height="294" />
<div>
<h3 style="text-align: left;">The Service, Costs, and Other Information…</h3>
Bass guitar lessons cost ￡25 for 45 minutes, include all learning materials and we will travel to you anywhere in the Sutton Coldfield area. Alternatively you can take advantage of our online lessons via Skype and receive a 10% discount. Just call 01675 475403 for more information.
</div>
</div>

Oh, and i forgot removing the float…

/* center images if display-width is below 980px */
@media (max-width: 979px){
  img.customimage {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    float: none;
  }
}

Hey Martonno,

Apologies for delay in replying, been on holiday and have only just had a chance to play with this…

Looks great thanks, works a charm ??

You are a legend!

Rog