mattmcc

Sorry never mind figured it out.

Or better yet perhaps... I already have the menu working with a plugin. How can I have the <div class="responsive-menu-icon</div> element not show on small screens?

Hi, On mobile devices the "secondary" navigation (actually the main navigation really), is shifted so far over to the left so that you can only just see the edge of the text in the menu when the screen is approx 750px wide, and otherwise not at all. How would I go about shifting it back across? http://claughtonprimary.co.uk/ Something in CSS is fixing the width at 740px. http://imgur.com/a/X2VNH

Essentially they would like to have a little bit of text on the noticeboard that they can change easily within the Wordpress CMS. Widget may not be the best way to do this...?

Hi, I want to position a text widget on the noticeboard on the image at this URL: http://newsite.arkholme.lancs.sch.uk. It needs to be responsive. Or is there a better way to do this other than a widget? I know the illustration is a stupid design for a homepage but please don't bother mentioning that because I'm afraid that's just the way it is Thanks so much for your help!

That homepage is yes... The rest is ok though, no?

To be honest, its made now. http://newsite.arkholme.lancs.sch.uk/ This image/page is just a kind of portal to the rest of the site - which is responsive... They are happy with it. But next time I would flat out refuse to implement a full illustration like this! Matt

They said they would be happy enough with just some dynamic text (i.e. some responsive text positioned on the noticeboard which can be changed by the user). Is this possible with the text being editable in Wordpress?

Hi Dap, No, you're advice was great but they don't want to back down on the full illustration. They accept that it won't be possible to do the drop downs, but they do insist that the latest posts show up on the notice board bottom left. That would require me carefully positioning a responsive widget wouldn't it. Or is there another way to do it? This isn't possible is it!? Matt

Thanks fisicx. Code in place now. I think I understand what you're suggesting. This is what they've asked for so I just need to go with it unfortunately.

Hi, This image is going to make up the homepage of my website. I need the "Our School", "Information", "Curriculum" and "Class News" areas of the image to make a drop down menu appear when a user hovers over them. What's the best way to go about this? I've been trying a method along these lines but have struggled to position the element below the image map and in any case, that's just a bit of text and not a list of links (though may be if I could position it, I could develop it further). This is what I'm trying: <div class="dropdown"> <div class="dropbtn"><area shape="rect" coords="348,592,532,701"></div> <div class="dropdown-content"> <a href="#">Link 1</a> <a href="#">Link 2</a> <a href="#">Link 3</a> </div> </div> .illustration { position: relative; width: 100%; height: auto; } /* Dropdown Button */ .dropbtn { background-color: #4CAF50; color: white; padding: 16px; font-size: 16px; border: none; cursor: pointer; } /* The container <div> - needed to position the dropdown content */ .dropdown { position: relative; display: inline-block; } /* Dropdown Content (Hidden by Default) */ .dropdown-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); } /* Links inside the dropdown */ .dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; } /* Change color of dropdown links on hover */ .dropdown-content a:hover {background-color: #f1f1f1} /* Show the dropdown menu on hover */ .dropdown:hover .dropdown-content { display: block; } /* Change the background color of the dropdown button when the dropdown content is shown */ .dropdown:hover .dropbtn { background-color: #3e8e41; } Thanks so much! Matt