Dreamweaver help thanks so much

Question

Hi there I am trying to create a nice website for display my artwork but I have a few issues that I have tried to resolve myself to no avail.
One is when I have the website to smartphone mobile view the buttons get hidden in the logo and I cannot get them to activate
Two is I created a form on the contact page and I have not been able to receive an email from this form
Three I created a class css ID for the heading 1 font to be a different font on all browsers but it does not seem to work and defaults to a generic font.
Four I am trying to address the expanding box problem for the logo and it does not seem to go away.
This website is just a work in progress, I just bought the domain and uploaded it yesterday.
Thanks so much I really appreciate it.
Monika Anderson
Here is the website
www.monikaandersondesign.com

Answer 1

monikaanderson wrote
One is when I have the website to smartphone mobile view the buttons get hidden in the logo and I cannot get them to activate
Just a couple of quick tips as I have not been able to look extensively at the issues.
1) Youre meant to relocate OR make the main menu disappear when the device screen width reaches a certain point creating a 'natural break' point with css media queries, which then displays the mobile menu:
@media screen and (max-width: 700px) {
/* hide the main menu from mobile devices */
#nav {
display: none;
/* display the mobile menu */
#mobileMenu {
display: block;
You are then meant to locate thie mobile menu in an area of the webpage that has the space to display it. Since you only have 4 links you could put the mobile menu under the 'nav' <div>
<div id="nav">
  <ul id="MenuBar1" class="MenuBarHorizontal">
    <li><a href="index.html">HOME</a>    </li>
    <li><a href="portfolio.html">PORTFOLIO</a></li>
    <li><a href="about.html">ABOUT</a>    </li>
    <li><a href="contact.html" class="MenuBarHorizontal">CONTACT</a></li>
  </ul>
</div>
<div id="mobileMenu">
Code for mobile menu goes here
<div>
A lot of website use a very simple <select> menu for mobile device. If you Google responsive navigation you will find some information on this method.
As for your form you only need 1 <form></form> tag for ALL of the information you wish to send so at the moment the form is set up incorrectly as you have used multiple form tags:
<form id="form1" name="form1" method="post" action="">
    <span id="nametextfield">
      <label for="name"></label>
      <input type="text" name="name" id="name" />
      <span class="textfieldRequiredMsg">A value is required.<br />
      <br />
      </span></span>
  </form>
  <form id="form2" name="form2" method="post" action="">
    <span id="emailtextfield">
    <label for="email"></label>
    <input type="text" name="email" id="email" />
    <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span>
    <p><span id="messagetextarea">
    <label for="message"></label>
    <textarea name="message" id="message" cols="45" rows="5"></textarea>
    <span id="countmessagetextarea"> </span><span class="textareaRequiredMsg">A value is required.</span><span class="textareaMinCharsMsg">Minimum number of characters not met.</span><span class="textareaMaxCharsMsg">Exceeded maximum number of characters.</span></span></p>
  </form>
  <form id="form3" name="form3" method="post" action="http://www.monikaandersondesign.com/formmail.php">
    <input type="submit" name="Submit" id="Submit" value="Submit" />
  </form>
There is a lot that is wrong with the construction like you're using absolutely positioned <divs> which is a no go area.
I've only just touched on the above points but hopefully it might help you a bit.