/    Sign up×
Community /Pin to ProfileBookmark

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

Copy linkTweet thisAlerts:
Jun 22.2013

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;} [/code]

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 [URL=”http://www.what-do-christians-believe.co.uk/test/slide.html”]page looks like this![/URL] 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

to post a comment
CSS

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@auntniniJun 22.2013 — 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 [COLOR="#FF0000"]class="menu"[/COLOR], not id="menu"

<i>
</i>... &lt;div id="title"&gt;
&lt;h1&gt;Welcome to what-do-christians-believe.co.uk&lt;/h1&gt;
&lt;h2&gt;Information about this site and the FREE to download studies and books&lt;/h2&gt;
&lt;div id="container"&gt;
&lt;div [COLOR="#FF0000"]id="menu"[/COLOR]&gt;&lt;a id="up"&gt;&lt;/a&gt;
&lt;nav&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="index.html"&gt;Home&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=""&gt;Studies&lt;/a&gt;
&lt;ul&gt;...
...
&lt;/ul&gt;&lt;/li&gt; ...
... &lt;/ul&gt;
&lt;/nav&gt;
&lt;/div&gt;
&lt;div [COLOR="#FF0000"]id="slideshow"[/COLOR]&gt;
&lt;div&gt;
&lt;img src="http://what-do-christians-believe.co.uk/wdcb-images/candles.png" alt="Photo: A church service being held in a park" &gt;
&lt;/div&gt;
&lt;div&gt;
&lt;img src="http://what-do-christians-believe.co.uk/wdcb-images/fire.png" alt="Photo: Jesus in the garden of Gethsemane" &gt;
&lt;/div
Copy linkTweet thisAlerts:
@tony_webbauthorJun 22.2013 — 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!
×

Success!

Help @tony_webb spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.24,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...