Digital Grin Photography Forum
Page 70  of  125
« First 20 60 66 67 68 69 70 71 72 73 74 80 120 Last »
Show 40 post(s) from this thread on one page

Digital Grin Photography Forum (http://www.dgrin.com/index.php)
-   SmugMug Customization (http://www.dgrin.com/forumdisplay.php?f=31)
-   -   Dropdown Navbar help thread (http://www.dgrin.com/showthread.php?t=168571)

tandrews Sep-14-2011 05:34 AM
In need of help...
 
I pulled my drop-down Navbar out (temporarily) and went back to the simple one to (hopefully) make it easier for me to make changes to location and see the effect, and learn what the hell I'm doing. I still can't figure out how to make it do what I want, though. Can someone point me in the right direction, please!!??! I've tried using the tool in firefox, but I can't put my finger on the code that's accomplishing what I want. Here's an example of effectively what I want (there are others, but I can't find them now... at work): http://www.tayookusanya.com/ I want my Navbar in the upper right corner in line with my logo/title/whatever-you-want-to-call-it. Like I said, if you can even just get me pointed in the right direction, it'd be much appreciated. I'll reinstall the drop-down navbar later today, so the current one isn't the one I'm looking to move. www.tandrews.smugmug.com
:dunno

EDIT: Here's another example: http://www.pullumphotography.com/ or here: http://www.ericholmesphotography.com/

Allen Sep-14-2011 05:42 AM
Quote:
Originally Posted by tandrews (Post 1672325)
I pulled my drop-down Navbar out (temporarily) and went back to the simple one to (hopefully) make it easier for me to make changes to location and see the effect, and learn what the hell I'm doing. I still can't figure out how to make it do what I want, though. Can someone point me in the right direction, please!!??! I've tried using the tool in firefox, but I can't put my finger on the code that's accomplishing what I want. Here's an example of effectively what I want (there are others, but I can't find them now... at work): http://www.tayookusanya.com/ I want my Navbar in the upper right corner in line with my logo/title/whatever-you-want-to-call-it. Like I said, if you can even just get me pointed in the right direction, it'd be much appreciated. I'll reinstall the drop-down navbar later today, so the current one isn't the one I'm looking to move. www.tandrews.smugmug.com
:dunno

EDIT: Here's another example: http://www.pullumphotography.com/ or here: http://www.ericholmesphotography.com/
When you do add it back in hide it. 1st step get the nav working then we can help position it on the page.

While you are working on your new dropdown navbar add this to your CSS
and only you will see it when logged in. It will allow you to get it perfect
before going public. Leave the old nav in for your visitors for now.

.notLoggedIn .menu {display: none;}

tandrews Sep-14-2011 05:47 AM
Disregard
 
Sorry, I think I found my answer here: http://www.dgrin.com/showthread.php?...ocation+navbar

Thanks anyway!! :D

Allen Sep-14-2011 05:51 AM
Quote:
Originally Posted by tandrews (Post 1672329)
Sorry, I think I found my answer here: http://www.dgrin.com/showthread.php?...ocation+navbar

Thanks anyway!! :D
Basically the same will be done with a drop menu. First step is perfect the menu.

tandrews Sep-14-2011 08:44 AM
Quote:
Originally Posted by Allen (Post 1672332)
Basically the same will be done with a drop menu. First step is perfect the menu.
OK, I reinstalled my dropdown navbar. Now I need help. I don't see what I need to change to move the beast. It's currently centered, covering my logo in my header. :dunno

Allen Sep-14-2011 08:51 AM
Quote:
Originally Posted by tandrews (Post 1672407)
OK, I reinstalled my dropdown navbar. Now I need help. I don't see what I need to change to move the beast. It's currently centered, covering my logo in my header. :dunno
CSS needs fixen to get nav CSS to work.
Add missing */
Put banner image on one line with no break. (scroll to the right)
Code:
/*Hides gallery navigation in the guestbook*/


#myBanner {
    background: transparent url(/photos/i-bQFCxdp/1/O/i-bQFCxdp.png) no-repeat;
    height:31px;
    width: 370px;
    _background: none;
    _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingmethod=image,
  src="http://tandrews.smugmug.com/photos/i-bQFCxdp/1/O/i-bQFCxdp.png");
}

tandrews Sep-14-2011 08:55 AM
Quote:
Originally Posted by Allen (Post 1672409)
CSS needs fixen to get nav CSS to work.
Add missing */
Put banner image on one line with no break. (scroll to the right)
Code:
/*Hides gallery navigation in the guestbook*/


#myBanner {
    background: transparent url(/photos/i-bQFCxdp/1/O/i-bQFCxdp.png) no-repeat;
    height:31px;
    width: 370px;
    _background: none;
    _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true, sizingmethod=image,
  src="http://tandrews.smugmug.com/photos/i-bQFCxdp/1/O/i-bQFCxdp.png");
}
Made those changes, thank you. Figures there's typos in my work. I don't see any change in the site behavior though. My logo is still covered by the Navbar/menu. If I change the float to right, all it does is reverse the order of my links, but the menu as a whole remains centered.

Allen Sep-14-2011 09:20 AM
Quote:
Originally Posted by tandrews (Post 1672411)
Made those changes, thank you. Figures there's typos in my work. I don't see any change in the site behavior though. My logo is still covered by the Navbar/menu. If I change the float to right, all it does is reverse the order of my links, but the menu as a whole remains centered.
Add/move the red in your header like this.
Code:
<div id="myHeader">

<!-- Original code by Stu Nicholls of -->
<!-- http://www.cssplay.co.uk/support.html -->
<div class="menu">
<ul>
<!--===============================This is the home button on NavBar===-->
...
...
</ul>
</div>  <!-- closes menu -->

<!-- End Navbar Code -->

<div id="myBanner"></div>

</div>  <!-- -closes myHeader ->
<div style="clear: both;"></div>

<p style="color:yellow;font-size:14px;text-align:center;">
We're making changes, please be patient!!
</p>
Change CSS like this
Code:
/*================================================================*/
/*======================HEADER====================================*/

#myHeader {
    padding: 0 20px;
    background: transparent url(http://tandrews.smugmug.com/photos/i-QmJR44j/0/X2/i-QmJR44j-X2.jpg) repeat-x;
    height: 40px;
    margin-bottom: 20px;
}

#myBanner {
  width: 276px;
  height: 25px;
  margin: 15px 0 0;
  background: url(http://www.tandrews.smugmug.com/photos/i-bQFCxdp/1/O/i-bQFCxdp.png) no-repeat;
  _background: none;
  _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true,
  sizingmethod=image, src='/photos/i-bQFCxdp/1/O/i-bQFCxdp.png');
}

/* CSS Dropdown Nav Bar */
/* Original code by Stu Nicholls of */
/* http://www.cssplay.co.uk/ */
/* Edited for content, formatting and some elements */
/* Please help support CSSPlay at: */
/* http://www.cssplay.co.uk/support.html */

/* CSS Section */

      /* style the outer div to give it width */
.menu {
  float: right;
  z-index:99;
  margin-top: 10px;  /* top R/L bottom */
  position:relative;    /* Make the container moveable */
}
I haven't figured out why the neg margin is needed for the banner yet.
EDit: got it, needed html fixen. Will have to change some of the #navcontainer CSS rules over to
class menu to get page highlight to change.
Probably this
Code:
/* highlight individual menu items when their page is current */
#navcontainer .navCurrentPageParent {border-bottom: 1px solid #CCCC00; border-top: 1px solid #CCCC00;}
#navcontainer .navCurrentPage {color: yellow;}
to this
Code:
/* highlight individual menu items when their page is current */
.menu .navCurrentPageParent {border-bottom: 1px solid #CCCC00; border-top: 1px solid #CCCC00;}
.menu .navCurrentPage {color: yellow;}

tandrews Sep-14-2011 01:28 PM
Quote:
Originally Posted by Allen (Post 1672417)
Add/move the red in your header like this.
Code:
<div id="myHeader">

<!-- Original code by Stu Nicholls of -->
<!-- http://www.cssplay.co.uk/support.html -->
<div class="menu">
<ul>
<!--===============================This is the home button on NavBar===-->
...
...
</ul>
</div>  <!-- closes menu -->

<!-- End Navbar Code -->

<div id="myBanner"></div>

</div>  <!-- -closes myHeader ->
<div style="clear: both;"></div>

<p style="color:yellow;font-size:14px;text-align:center;">
We're making changes, please be patient!!
</p>
Change CSS like this
Code:
/*================================================================*/
/*======================HEADER====================================*/

#myHeader {
    padding: 0 20px;
    background: transparent url(http://tandrews.smugmug.com/photos/i-QmJR44j/0/X2/i-QmJR44j-X2.jpg) repeat-x;
    height: 40px;
    margin-bottom: 20px;
}

#myBanner {
  width: 276px;
  height: 25px;
  margin: 15px 0 0;
  background: url(http://www.tandrews.smugmug.com/photos/i-bQFCxdp/1/O/i-bQFCxdp.png) no-repeat;
  _background: none;
  _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=true,
  sizingmethod=image, src='/photos/i-bQFCxdp/1/O/i-bQFCxdp.png');
}

/* CSS Dropdown Nav Bar */
/* Original code by Stu Nicholls of */
/* http://www.cssplay.co.uk/ */
/* Edited for content, formatting and some elements */
/* Please help support CSSPlay at: */
/* http://www.cssplay.co.uk/support.html */

/* CSS Section */

      /* style the outer div to give it width */
.menu {
  float: right;
  z-index:99;
  margin-top: 10px;  /* top R/L bottom */
  position:relative;    /* Make the container moveable */
}
I haven't figured out why the neg margin is needed for the banner yet.
EDit: got it, needed html fixen. Will have to change some of the #navcontainer CSS rules over to
class menu to get page highlight to change.
Probably this
Code:
/* highlight individual menu items when their page is current */
#navcontainer .navCurrentPageParent {border-bottom: 1px solid #CCCC00; border-top: 1px solid #CCCC00;}
#navcontainer .navCurrentPage {color: yellow;}
to this
Code:
/* highlight individual menu items when their page is current */
.menu .navCurrentPageParent {border-bottom: 1px solid #CCCC00; border-top: 1px solid #CCCC00;}
.menu .navCurrentPage {color: yellow;}
Freakin' sweet. That got the menu over where I want it, you rock, Allen!! :clap One last problem, though. Now, my logo appears below the header. I'm pretty sure I understand why this is happening: it's displaying the header and navbar, and THEN myBanner. What I don't know, though, is how to fix this this. Is it a simple issue of changing the order of a couple things, or do the items need to be handled differently?? I'm still a newb at all this stuff, so believe me, your help is GREATLY appreciated!!!

Allen Sep-14-2011 03:51 PM
Quote:
Originally Posted by tandrews (Post 1672520)
Freakin' sweet. That got the menu over where I want it, you rock, Allen!! :clap One last problem, though. Now, my logo appears below the header. I'm pretty sure I understand why this is happening: it's displaying the header and navbar, and THEN myBanner. What I don't know, though, is how to fix this this. Is it a simple issue of changing the order of a couple things, or do the items need to be handled differently?? I'm still a newb at all this stuff, so believe me, your help is GREATLY appreciated!!!
Remove the extra div.

</div> <!-- closes menu -->
<div style="clear: both;"></div>
<!-- End Navbar Code -->
<div id="myBanner"></div>
</div> <!-- -closes myHeader ->
<div style="clear: both;"></div>
<p style="color:yellow;font-size:14px;text-align:center;">
We're making changes, please be patient!!
</p>

Allen Sep-14-2011 03:54 PM
Quote:
Originally Posted by tandrews (Post 1672520)
Freakin' sweet. That got the menu over where I want it, you rock, Allen!! :clap One last problem, though. Now, my logo appears below the header. I'm pretty sure I understand why this is happening: it's displaying the header and navbar, and THEN myBanner. What I don't know, though, is how to fix this this. Is it a simple issue of changing the order of a couple things, or do the items need to be handled differently?? I'm still a newb at all this stuff, so believe me, your help is GREATLY appreciated!!!
I forgot to post one of the things you might like. Add/change red.
Code:
      /* style the links for the top level */
.menu a, .menu a:visited {
  display:block;
  font-size:8pt;
  text-decoration:none;
  color:white;
  background:none;
/*  border:1px solid black; */
/*  border-width:1px 1px 1px 1px; */
  font-family: verdana;
  width:auto;            /* Defines the main box dimensions. */
  height:18px;          /*How tall your cells are */
  line-height:18px;      /*Adjust this to vertically center your text in each cell. Should be about the same as height. */
  padding: 0 10px;
  min-width: 50px;
}
You also have a problem with the menu flyouts going off the right side
of the page. Don't go away till we get that fixed.

Allen Sep-14-2011 05:08 PM
Quote:
Originally Posted by tandrews (Post 1672520)
...
Change the padding in this rule. Moves menu left so flyout stays visible on page.
Code:
#myHeader {
    padding: 0 40px 0 20px; /* top R bottom L */
    background: transparent url(http://tandrews.smugmug.com/photos/i-QmJR44j/0/X2/i-QmJR44j-X2.jpg) repeat-x;
    height: 40px;
    margin-bottom: 20px;
}
Replace the menu CSS with this. Sorted rules by level and adjusted flyouts.
Code:
/* CSS Dropdown Nav Bar */
/* Original code by Stu Nicholls of */
/* http://www.cssplay.co.uk/ */
/* Edited for content, formatting and some elements */
/* Please help support CSSPlay at: */
/* http://www.cssplay.co.uk/support.html */

/* CSS Section */

      /* style the outer div to give it width */
.menu {
  float: right;
  z-index:99;
  position:relative;    /* Make the container moveable */
  margin-top: 10px;    /* move menu up and down */
}

      /* remove all the bullets, borders and padding from the default list styling */
.menu ul {
  padding:0;
  margin:0;
  list-style-type:none;
}

      /* float the list to make it horizontal and a relative position so that you can control the dropdown menu positon */
.menu li {
  float:left;          /* float right will reverse the main buttons */
  text-align:center;
  width:auto;
  position:relative;
  padding: 0;
}

      /* style the links for the top level */
.menu a, .menu a:visited {
  display:block;
  text-decoration:none;  /* none, overline, underline */
  color:white;
  background:none;
  font-size:8pt;
  font-family: verdana;
  width:auto;        /* Defines the main box dimensions. */
  height:18px;        /* How tall your cells are */
  line-height:18px;  /* vertical text alignment in cell */
  padding: 0 10px;    /* top/bottom R/L */
  min-width: 50px;    /* set to smallest text and use R/L padding above to space out */
}

      /* main hover */
.menu a:hover, .menu :hover > a {
  color:black;
  background:yellow;
}

      /* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {width:130px; w\idth:130px;}

      /* style the table so that it takes no part in the layout */
.menu table {position:absolute; top:0; left:0;}



      /* ***** LEVEL 2 ***** LEVEL 2 ***** LEVEL 2 ***** */

      /* another hack for IE5.5 */
* html .menu ul ul {top:20px; t\op:21px;}  /* IE gap between main bar and the dropdown items */


      /* hide the sub levels and give them a position absolute so that they take up no room */
.menu ul ul {
  visibility:hidden;
  position:absolute;
  height:0;
  top:18px;      /* move drop vertically */
  left:0;        /* move drop horizontally  */
  width:90px;    /* Size of the daughter cells */
}

      /* style the second level background non-hover */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:black;}  /* if 3rd level exists */

      /* style the second level hover */
.menu ul ul a.drop:hover {background:yellow;}
.menu ul ul :hover > a.drop {background:yellow;}

      /* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
  color:white;
  background:black;
  height:18px;
  line-height:18px;
  width:90px;
}

.menu ul ul :hover > a.drop  {background:yellow;}  /* 2nd if 3rd level exists */

      /* yet another hack for IE5.5 */
* html .menu ul ul a {width:120px; w\idth:120px;}

      /* 2nd level hover */
.menu ul ul a:hover, .menu ul ul :hover > a {
  color:black;
  background:yellow;
}



      /* ***** LEVEL 3 ***** LEVEL 3 ***** LEVEL 3 ***** */

      /* position the third level flyout menu */
.menu ul ul ul {
  left:110px;
  top:0;
  width:90px;
  height:auto;
}

.menu ul ul ul li a {color:white;}
.menu ul ul ul li a:hover {color:black;}

      /* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:black;}  /* not FF */

      /* style the third level hover */
.menu ul ul ul a:hover {background:yellow;}
.menu ul ul ul :hover > a {background:yellow;}    /* 3rd (w/o 4th) 4th hover */

      /* style the third level links */
.menu ul ul ul a, .menu ul ul ul a:visited {
  color:white;              /* hover 2nd > 3rd & 4th */
  background:black;      /* hover 3rd > 4th */
  height:18px;
  line-height:18px;
  width:80px;
}


      /* ***** LEVEL 4 ***** LEVEL 4 ***** LEVEL 4 ***** */

      /* position the fourth level flyout menu */
.menu ul ul ul ul {
  left:130px;
  top:0;
  width:130px;
  height: auto !important;
}

    /* 4th level non-hover */
.menu ul ul ul ul li a {
  color:black;
  width:150px;
}

      /* style the fourth level hover */
.menu ul ul ul ul a:hover {background:yellow;}
.menu ul ul ul ul :hover > a {background:yellow;}


      /* make the 2nd level visible when hover on 1st level */
.menu ul :hover ul {visibility:visible;}
      /* make the 3rd level visible when you hover over 2nd level */
.menu ul :hover ul :hover ul {visibility:visible;}
      /* make the 4th level visible when you hover over 3rd level */
.menu ul :hover ul :hover ul :hover ul {visibility:visible;}
      /* keep the 3rd level hidden when you hover on 1st level */
.menu ul :hover ul ul {visibility:hidden;}
      /* keep the 4th level hidden when you hover on 2nd level */
.menu ul :hover ul :hover ul ul {visibility:hidden;}

/* End Navbar Code */

tandrews Sep-14-2011 05:39 PM
Quote:
You also have a problem with the menu flyouts going off the right side
of the page. Don't go away till we get that fixed.
:bow:bow:bow:bow:bow:bow:bow:bow

Awesome!!! That's exactly what I wanted. Thank you so much!!

tandrews Sep-14-2011 05:47 PM
Something isn't right with the footer (as in, half the footer shows up and the slideshow isn't there) when viewed in Firefox, however. In Chrome it works fine. I really don't have an answer for that... cross-browser compatibility = WAY over my head.

Allen Sep-14-2011 06:33 PM
Quote:
Originally Posted by tandrews (Post 1672641)
Something isn't right with the footer (as in, half the footer shows up and the slideshow isn't there) when viewed in Firefox, however. In Chrome it works fine. I really don't have an answer for that... cross-browser compatibility = WAY over my head.
It looks fine here with Firefox 6.0.2 and IE9.

BUT, your nav is messed up. There are html errors. I'll take a look. Be back.

Allen Sep-14-2011 06:45 PM
Quote:
Originally Posted by tandrews (Post 1672641)
Something isn't right with the footer (as in, half the footer shows up and the slideshow isn't there) when viewed in Firefox, however. In Chrome it works fine. I really don't have an answer for that... cross-browser compatibility = WAY over my head.
Removed a few class="drop" and this extra line.
Code:
                <li><a href="#link">Roo</a></li>
                    <!--[if lte IE 6]><table><tr><td><![endif]-->
            </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
Change your header to this.
Code:
<div id="myHeader">
<!-- Original code by Stu Nicholls of -->
<!-- http://www.cssplay.co.uk/ -->
<!-- Edited for content, formatting, and some elements -->
<!-- Please help support CSSPlay at: -->
<!-- http://www.cssplay.co.uk/support.html -->
<div class="menu">
<ul>
<!--===============================This is the home button on NavBar===-->
<li><a href="/" title="">Home</a></li>
<!--===============================First Drop Down (Our Portfolios)====-->
<li><a class="drop" href="/share/portfolios" title="">Our Portfolios
    <!--[if gte IE 7]><!--></a><!--<![endif]-->
    <!--[if lte IE 6]><table><tr><td><![endif]-->
    <ul>
<!--=======================================-->
        <li><a href="/TAndrews/Tims-Portfolio/18822874_LWGNJf" title="">Tim's Portfolio</a></li>
<!--=======================================-->
        <li><a href="/SAndrews/Sams-Portfolio/18613340_BNdh4S" title="">Sam's Portfolio</a></li>
    </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!--===============================Second Drop Down (Tim's Photos)=====-->
<li><a class="drop" href="/tandrews" title="">Tim's Photos
    <!--[if gte IE 7]><!--></a><!--<![endif]-->
    <!--[if lte IE 6]><table><tr><td><![endif]-->
    <ul>
<!--=======================================-->
        <li><a href="/TAndrews/Tims-Portfolio/18822874_LWGNJf" title="">Portfolio</a></li>
<!--=======================================-->
        <li><a href="/gallery/18910515_gCGZkf" title="">Daily Photo</a></li>
<!--=======================================-->
        <li><a href="/tandrews/people" title="">People</a></li>
<!--=======================================-->
        <li><a class="drop" href="/tandrews/places&amp;things" title="">Places&amp;Things
            <!--[if gte IE 7]><!--></a><!--<![endif]-->
            <!--[if lte IE 6]><table><tr><td><![endif]-->
            <ul>
                <li><a href="#link" title="">Charleston, SC</a></li>
                <li><a href="#link" title="">Savannah, GA</a></li>
                <li><a href="#link" title="">Charlotte, NC</a></li> 
            </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>
<!--=======================================-->
        <li><a class="drop" href="/tandrews/animals" title="">Animals
            <!--[if gte IE 7]><!--></a><!--<![endif]-->
            <!--[if lte IE 6]><table><tr><td><![endif]-->
            <ul>
                <li><a href="#link" title="">Bordeaux</a></li>
                <li><a href="#link" title="">Kanga</a></li>
                <li><a href="#link" title="">Madeira</a></li>
                <li><a href="#link" title="">Roo</a></li>
            </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>
    </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!--===============================Third Drop Down (Sam's Photos)======-->
<li><a class="drop" href="/sandrews" title="">Sam's Photos
    <!--[if gte IE 7]><!--></a><!--<![endif]-->
    <!--[if lte IE 6]><table><tr><td><![endif]-->
    <ul>
<!--=======================================-->
        <li><a href="/SAndrews/Sams-Portfolio/18613340_BNdh4S" title="">Portfolio</a></li>
<!--=======================================-->
        <li><a href="/SAndrews/PlacesThings" title="">Places/Things</a></li>
<!--=======================================-->
        <li><a class="drop" href="/share/csusports" title="">Sports
            <!--[if gte IE 7]><!--></a><!--<![endif]-->
            <!--[if lte IE 6]><table><tr><td><![endif]-->
            <ul>
                <li><a href="/sandrews/sailing/" title="">Sailing</a></li>
                <li><a href="/sandrews/soccer/" title="">Soccer</a></li>
                <li><a href="/sandrews/volleyball/" title="">Volleyball</a></li> 
            </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
        </li>
    </ul> <!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
<!--====================================================(About Us)=====-->
<li><a href="/gallery/18883423_Q5c29F" title="">About Us</a></li>
</ul>
</div>  <!-- closes menu -->
<!-- End Navbar Code -->
<div id="myBanner"></div>
</div>  <!-- -closes myHeader ->
<div style="clear: both;"></div>

tandrews Sep-15-2011 03:17 AM
Quote:
Originally Posted by Allen (Post 1672662)
It looks fine here with Firefox 6.0.2 and IE9.

BUT, your nav is messed up. There are html errors. I'll take a look. Be back.
Awesome, thank you, again, so much for the help. What I realized, is that I had an outdated version of Firefox; new version works great. What's weird, though, is that I had the same outdated version on both my MBP and my PC and it worked on my Mac but not my PC.

rharris Sep-16-2011 04:35 AM
I've got a strange "line" at the end of my navbar where I removed something. It's also at the beginning, although less obvious. I've gone through the code but nothing really jumps out at me, tried adjusting some things but to no effect.

Any ideas?

Allen Sep-16-2011 05:37 AM
Quote:
Originally Posted by rharris (Post 1673316)
I've got a strange "line" at the end of my navbar where I removed something. It's also at the beginning, although less obvious. I've gone through the code but nothing really jumps out at me, tried adjusting some things but to no effect.

Any ideas?
Remove the padding from this.
Code:
.menu {
    text-decoration: none;
    background-color: #27408B;
    color: #000;
    padding: 4px 4px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}
Minimize the width in this to center nav,.
Code:
  /* style the outer div to give it width */
.menu {
  z-index:99;
  margin: 20px auto 20px;  /* top R/L bottom */
  width:720px;          /* Main bar total width, minimize to center */
}

rharris Sep-16-2011 05:48 AM
Thanks Alan, that sorted it, but I've lost the "rounded corners" I used to have to it... confusing!


Times are GMT -8.   It's 08:43 AM.
Page 70  of  125
« First 20 60 66 67 68 69 70 71 72 73 74 80 120 Last »
Show 40 post(s) from this thread on one page

Powered by vBulletin® Version 3.8.5
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.