Hej alle sammen! Jeg arbejder på en hjemmeside hvor jeg har lavet en dropdown der er smidt ind i header. Den header har jeg så inkluderet på min index side, hvor jeg har 3 billeder der er smidt ind i HTML. Er rimligt ny, og det virkede ikke i css, så det blev HTML istedet. Når. Den skulle meget gerne gå ned over billederne, så hvad skal jeg gøre? I kan se lidt koder her:
header.css- /*
- Document : header
- Created on : 23-04-2013, 18:17:01
- Author : Jannick
- Description:
- Purpose of the stylesheet follows.
- */
-
- root {
- display: block;
- }
-
- body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote {
- margin: 0; padding: 0; border: 0;
- }
-
- body {
- font-family: Helvetica, sans-serif;
- font-size: 18px;
- line-height: 24px;
- }
-
- #logo {
- margin-left: 5px;
- }
-
- #Menu {
- margin: 20px auto;
- margin-top: -130px;
- }
-
- nav {
- text-align: center;
- }
-
- nav ul ul {
- display: none;
- }
-
- nav ul li:hover > ul {
- display: block;
- }
-
- nav ul {
- background: #efefef;
- background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);
- background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%);
- background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%);
- box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
- padding: 0 20px;
- border-radius: 10px;
- list-style: none;
- position: relative;
- display: inline-table;
- }
-
- nav ul:after {
- content: "";
- clear: both;
- display: block;
- }
-
- nav ul li {
- float: left;
- }
-
- nav ul li:hover {
- background: #4b545f;
- background: linear-gradient(top, #4f5964 0%, #5f6975 40%);
- background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%);
- background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%);
- }
-
- nav ul li:hover a {
- color: #fff;
- }
-
- nav ul li a {
- display: block;
- padding: 25px 40px;
- color: #757575;
- text-decoration: none;
- }
-
- nav ul ul {
- background: #5f6975;
- border-radius: 0px;
- padding: 0;
- position: absolute;
- top: 100%;
- }
-
- nav ul ul li {
- float: none;
- border-top: 1px solid #6b727c;
- border-bottom: 1px solid #575f6a;
- position: relative;
- }
-
- nav ul ul li a {
- padding: 15px 40px;
- color: #fff;
- }
-
- nav ul ul li a:hover {
- background: #4b545f;
- }
-
- nav ul ul ul {
- position: absolute;
- left: 100%;
- top:0;
- }
header.php
- <div id="Menu">
- <nav>
- <ul>
- <li><a href="index.php">Forside</a></li>
- <li><a href="glas.php">Glas</a>
- <ul>
- <li><a href="butiksruder.php">Butiksruder</a></li>
- <li><a href="sikkerhedsglas.php">Sikkerhedsglas</a></li>
- <li><a href="funktionsruder.php">Funktionsruder</a></li>
- <li><a href="butiksruder.php">Butiksruder</a></li>
- </ul>
- <ul>
- <li><a href="butiksruder.php">Butiksruder</a></li>
- <li><a href="butiksruder.php">Butiksruder</a></li>
- <li><a href="butiksruder.php">Butiksruder</a></li>
- </ul>
- </li>
- <li><a href="galleri.php">Galleri</a></li>
- <li><a href="garantiordning.php">Garantiordning</a></li>
- <li><a href="kontakt.php">Kontakt</a></li>
- </ul>
- </nav>
- </div>
index.php
- <div class="pic1">
- <img src="assest/img/1.jpg" height="228" width="226" title="Danmarks bedste Glarmestre">
- <div class="button">
- <a href="funktionsruder.php"><p>Funktionsruder</p></a>
- </div>
- </div>
- <div class="pic2">
- <img src="assest/img/2.jpg" height="228" width="226" title="Danmarks bedste Glarmestre">
- <div class="button">
- <a href="sikkerhedsglas.php"><p> Sikkerhedsglas</p></a>
- </div>
- </div>
- <div class="pic3">
- <img src="assest/img/3.jpg" height="228" width="226" title="Danmarks bedste Glarmestre">
- <div class="button">
- <a href="butiksruder.php"><p> Butiksruder</p></a>
- </div>
- </div>
- </div>
Jeg har prøvet at få dem til at stå ved siden ad hinanden, hvilket er en godkendt løsning, men det lykkedes heller ikke! Håber i kan hjælpe. Store som små ændringer, og gerne forslag :-)
Mvh