-
1. Re: Question regarding Drop Down Menu options
Check out Spry Dropdown in Dreamweaver. You could insert a new Spry Horizontal Dropdown and copy/ paste your existing style to it under the Spry's CSS file.
In Dreamweaver, Insert > Spry > Spry Menu Bar
-
2. Re: Question regarding Drop Down Menu options
Or if you want to use your existing code and build a custom menu, you can check out Superfish at http://archive.plugins.jquery.com/project/Superfish
I've used this in one of my company's websites at www.forwardfocus.in
-
3. Re: Question regarding Drop Down Menu options
I am trying to preview my website in Chrome however it seems that the website is only taking up the central portion of the page and leaving two gaps either side. Below is my code:
@charset "utf-8";
/* CSS Document */
article, aside, figure, footer, header, nav, section {
display: block;
}
body {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
color: #000;
background-color: #CFF;
margin: 0px;
padding: 0px;
}
#container {
width: 840px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
#Logo {
background-image: url(pictures/Logo_2.png);
background-repeat: no-repeat;
height: 80px;
width: 100%;
}
#Logo hgroup {
position: absolute;
top: -500px;
}
nav {
padding-top: 100px;
}
ul {
padding:0;
margin:0;
}
nav ul {
list-style: none;
margin-bottom: 15px;
font-weight: bold;
font-size:20px;
}
nav ul li {
float: left;
-webkit-transition-duration:.1s;
-webkit-transition-property:margin-top;
-webkit-transition-timing-function:ease-in-out;
-o-transition-duration:.1s;
-o-transition-property:margin-top;
-o-transition-timing-function:ease-in-out;
-moz-transition-duration:.1s;
-moz-transition-property:margin-top;
-moz-transition-timing-function:ease-in-out;
transition-duration:.1s;
transition-property:margin-top;
transition-timing-function:ease-in-out;
}
nav ul a {
display: block;
width:140px;
padding: 10px;
text-align:center;
text-decoration: none;
color: #fff;
border: 2px solid #618A37;
margin: 5px 0px;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
-moz-box-shadow: rgba(0,0,0,0.3) 1px 1px 3px;
-webkit-box-shadow: rgba(0,0,0,0.3) 1px 1px 3px;
box-shadow: rgba(0,0,0,0.3) 1px 1px 3px;
text-shadow: rgba(0,0,0,0.8) 1px 1px 1px;
}
nav ul a:link, nav ul a:visited {
background: rgba(255,255,255,0.2);
}
nav ul a:hover, nav ul a:active, nav ul a:focus {
background: rgba(255,255,255,0.4);
}
#maincontent {
margin-top: 40px;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 10px;
padding-left: 0px;
}
#vision {
font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
font-size:32px;
font-weight:bold;
line-height:1.2;
background-image:url(../images/lrg_hero.jpg);
background-repeat:no-repeat;
width: 409px;
height:60px;
padding:60px 370px 0 40px;
margin-bottom:20px;
}
.pod {
background: #cff;
padding: 5px;
width: 244px;
float:left;
margin-right: 13px;
}
.podContent {
margin-top:10px;
width: 244px;
height:181px;
overflow:hidden;
}
.pod h1 {
background: #CCC;
color: #000;
padding:5px;
background-position:95%;
font-size:16px;
font-weight:normal;
margin: 0 0 13px 0;
}
a.block {
text-decoration:none;
display:block;
}
footer {
padding: 10px 0;
clear:both;
color: #fff;
}
footer p {
margin:0 0 5px 0;
}
#phone {
font-weight:bold;
color: #000;
}
#facebookTwitter {
float:right;
margin-right:25px;
}
Can you see something wrong?
Thanks
-
4. Re: Question regarding Drop Down Menu options
Right. Your #container is centered on screen by this CSS rule:
#container {
width: 840px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
If not centered on screen, then what did you have in mind?
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
-
5. Re: Question regarding Drop Down Menu options
how would I keep it to the left and keep the right free.Would I just change margin-left to 0px?
-