title: Menu Style When Using Inline Frame
body: <p>I have an inline frame in which the content displays, the problem i have is that I can not get the Css menu to show the style of which page is currently open. I have looked on the net at this and can be done via JAVA I think.</p>
  
  <p>Im new to coding and not that good, could someone please help. Ive been stuck on this for days</p>
  
  <p>My Index Html and Index CSS code is below</p>
  
  <p><strong>My code from the index html page</strong></p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;meta charset="utf-8"&gt;
  
  &lt;title&gt;Untitled Page&lt;/title&gt;
  &lt;meta name="generator" content="Web Builder - http://www.webbuilder.com"&gt;
  &lt;link href="css/Untitled1.css" rel="stylesheet"&gt;
  &lt;link href="css/index.css" rel="stylesheet"&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;iframe name="InlineFrame1" id="
  
  InlineFrame1" style="position:absolute;left:27px;top:155px;width:852px;height:286px;z-index:0;" src="./page1.html"&gt;&lt;/iframe&gt;
  &lt;div id="wb_CssMenu1" style="position:absolute;left:395px;top:17px;width:336px;height:100px;z-index:1;"&gt;
  &lt;ul&gt;
  &lt;li class="firstmain"&gt;&lt;a href="./page1.html" target="InlineFrame1"&gt;Item&amp;nbsp;1&lt;/a&gt;
  
  &lt;/li&gt;
  &lt;li&gt;&lt;a href="./page2.html" target="InlineFrame1"&gt;Item&amp;nbsp;2&lt;/a&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  &lt;br&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>My code from the Index Css Page</strong></p>
  
  <pre><code>body
     {
     background-color: #FFFFFF;
     color: #000000;
     font-family: Arial;
     font-weight: normal;
     font-size: 13px;
     line-height: 1.1875;
     margin: 0;
     padding: 0;
     }
     #InlineFrame1
     {
     border: 1px #C0C0C0 solid;
     }
     #wb_CssMenu1
     {
     border: 0px #C0C0C0 solid;
     background-color: transparent;
     }
  #wb_CssMenu1 ul
  {
  
  
  
   list-style-type: none;
     margin: 0;
     padding: 0;
  }
  #wb_CssMenu1 li
  {
     float: left;
     margin: 0;
     padding: 0px 4px 0px 0px;
     width: 80px;
  
  }
  #wb_CssMenu1 a
  {
     display: block;
     float: left;
     color: #666666;
     border: 1px #C0C0C0 solid;
     background-color: #EEEEEE;
     background-image: none;
     font-family: Arial;
  
  
  
  font-weight: normal;
     font-size: 13px;
     font-style: normal;
     text-decoration: none;
     width: 68px;
     height: 26px;
     padding: 0px 5px 0px 5px;
     vertical-align: middle;
     line-height: 26px;
     text-align: center;
  }
  #wb_CssMenu1 li:hover a, #wb_CssMenu1 a:hover, #wb_CssMenu1 .active
  {
     color: #666666;
     background-color: #C0C0C0;
     background-image: none;
     border: 1px #C0C0C0 solid;
  }
  #wb_CssMenu1 li.firstmain
  {
     padding-left: 0px;
  }
  #wb_CssMenu1 li.lastmain
  {
     padding-right: 0px;
  }
  #wb_CssMenu1 br
  {
     clear: both;
     font-size: 1px;
     height: 0;
     line-height: 0;
  </code></pre>
  
  <p>not an answer, but adding to my post</p>
  
  <p>Jonny.milano</p>
  
  <p>Sorry its a bit long.</p>
  
  <p>I dont have a URL at this moment in time as the site is in the design stage.</p>
  
  <p>So here is a bit more info, hope it helps as i am really stuck on this one.</p>
  
  <p>On the above code example I have an index page. On the index page I have a Inline frame and a CSS menu with 2 buttons and another 2 pages, so the site in total has 3 pages, Index, Page1 and Page2</p>
  
  <p>When the index page is opened, the page1 with its content opens in the inline frame, see the code below, page1 is set as firstmain</p>
  
  <p>Item&nbsp;1</p>
  
  <p>The CSS menu buttons styles are set for grey font and white back ground in none hover or active mode.</p>
  
  <p>When CSS menu buttons has mouse hovering or the page is active, then the menu style changes to white font and grey back ground.</p>
  
  <p>My problem is this, The buttons work fine when hovering, the style change as stated above. However the style does not remain changed when the page is active, i.e when the page is showing inthe inline frame.</p>
  
  <p>Currently When the index page is opened and page1 shows in the inline frame, and the CSS style is showing as grey font and white back ground for both buttons, this is wrong</p>
  
  <p>When it should show as</p>
  
  <p>Button1 should be as White font and Grey background as page 1 is active and for Button2 it should show as GREY FONT with WHITE BACKGROUND, the none active/mouse hover style. When page2 is active the style should change to show page2 is now the active page and not page1</p>
  
  <p>In short, what i'm asking for is that the menu style change for the active page that is SHOWING in the inline frame, this helps the user identify which page is active. I need it to this for all buttons.</p>
  
  <p>from another form, similar problem, I tried to use the above code, but can't adapt it for me as i have limited coding skills.</p>
  
  <p>sorry for any spelling errors</p>
  
  <p>thanks</p>