StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>The <code>#menu</code> must have a <code>position:relative;</code></p> <p>This way, the <code>#submenu</code> will have <code>position:absolute;</code> according to the <code>#menu</code> and inside of it, <code>left:0px;</code> means it will stick on the left border of the <code>#menu</code> and this is what you want, no need for a <code>margin-left</code> and a <code>margin-top</code>, just add <code>top:30px;</code> and test it if its positioned correctly under <strong>Galerie</strong>, maybe you'll need to increase the top or decrease it.</p> <pre><code>#menu { position:relative; } #submenu { display: none; padding: 0px; position: absolute; left: 0px; top:30px; //find the best value } </code></pre> <p><strong>UPDATE</strong></p> <p>When I said that the <code>#menu</code> must have a <code>position:relative;</code> I thought that the <code>#menu</code> is a div that only contains the <code><a></code> <strong>Galerie</strong>, if this is not the case, if the <code>#menu</code> contains all the 4 links: Uvod .. Cenik.. etc... then of course it will stick at the beginning.</p> <p>What you need to do is to add a <strong>special div container</strong> for the Galerie, means...</p> <pre><code><div id="menu"> <a href="">Uvod</a> <a href="">Cenik</a> <div id="galerieParent"> <a href="">Galerie</a> <div id="submenu"> ...... </div> </div> <a href="">Kontakt</a> </div> </code></pre> <p>Now, the <code>position:relative;</code> must be set for <code>#galerieParent</code>.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload