www.webdeveloper.com
Results 1 to 3 of 3

Thread: problems with display:none in css and using #container .menu

Hybrid View

  1. #1
    Join Date
    Jul 2012
    Location
    Vantaa, Finland
    Posts
    125

    problems with display:none in css and using #container .menu

    I am trying to update my website by changing the header and making the changes responsive.

    I have been using;

    Code:
    #container {width: 100%;}
    #container .menu {display: none;}
    #container .slideshow {width: 100%; height: auto;}
    #container .buttns {display: none;}
    Where container is the division and .menu etc is the class.

    In the html page I did change divisions in the container to class="slideshow" etc

    What I end up with is with the classes being stacked on top of each other and the slideshow staying at full size.

    On a full screen the page looks like this! which is how it should look.

    I just want to remove the menu and buttons and make the slideshow responsive.
    The other sections work OK.

    Can someone advise me on how to correct this? Thanks

  2. #2
    Join Date
    Sep 2006
    Location
    new york
    Posts
    266
    I did not get to your CSS file, BUT looking at the xource code, there are IDs menu, slidesho, etc. NOT classes. If you define .CLASS in CSS, you have to specify class="menu", not id="menu"

    Code:
    ... <div id="title">
    <h1>Welcome to what-do-christians-believe.co.uk</h1>
    <h2>Information about this site and the FREE to download studies and books</h2>
    <div id="container">
    <div id="menu"><a id="up"></a>
    <nav>
     <ul>
      <li><a href="index.html">Home</a></li>
      <li><a href="">Studies</a>
       <ul>...
        ...
       </ul></li> ...
      ...  </ul>
    </nav> 
    </div>
    <div id="slideshow">
       <div>
         <img src="http://what-do-christians-believe.co.uk/wdcb-images/candles.png" alt="Photo: A church service being held in a park" >
       </div>
       <div>
         <img src="http://what-do-christians-believe.co.uk/wdcb-images/fire.png" alt="Photo: Jesus in the garden of Gethsemane" >
       </div
    Last edited by auntnini; 06-22-2013 at 03:43 PM. Reason: typos

  3. #3
    Join Date
    Jul 2012
    Location
    Vantaa, Finland
    Posts
    125
    Thanks. I declared class instead of div class in the html
    It didn't work at first. I needed to add #container to get the .slideshow etc to work but the menu wouldn't show the sub menus. I then remove #container from the menu options and it works. Now, I am happy as a pig in mud!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles