Go Back   AnandTech Forums > Software > Programming

Forums
· Hardware and Technology
· CPUs and Overclocking
· Motherboards
· Video Cards and Graphics
· Memory and Storage
· Power Supplies
· Cases & Cooling
· SFF, Notebooks, Pre-Built/Barebones PCs
· Networking
· Peripherals
· General Hardware
· Highly Technical
· Computer Help
· Home Theater PCs
· Consumer Electronics
· Digital and Video Cameras
· Mobile Devices & Gadgets
· Audio/Video & Home Theater
· Software
· Software for Windows
· All Things Apple
· *nix Software
· Operating Systems
· Programming
· PC Gaming
· Console Gaming
· Distributed Computing
· Security
· Social
· Off Topic
· Politics and News
· Discussion Club
· Love and Relationships
· The Garage
· Health and Fitness
· Merchandise and Shopping
· For Sale/Trade
· Hot Deals
· Free Stuff
· Contests and Sweepstakes
· Black Friday 2013
· Forum Issues
· Technical Forum Issues
· Personal Forum Issues
· Suggestion Box
· Moderator Resources
· Moderator Discussions
   

Reply
 
Thread Tools
Old 01-23-2013, 12:04 AM   #1
Copenhagen69
Diamond Member
 
Join Date: Feb 2005
Posts: 3,017
Default What piece of code am I looking for? (pic inside)

I am trying to lower the nav bar, but dont know much about CSS. So I was wondering what type of code I am looking for to adjust the nav bar and lower it some.

any ideas?


Thanks ahead of time!


Copenhagen69 is offline   Reply With Quote
Old 01-23-2013, 12:14 AM   #2
Markbnj
Moderator
Programming
 
Markbnj's Avatar
 
Join Date: Sep 2005
Posts: 10,512
Default

Hard to say without seeing the current markup and styles. Look in the markup and see what inline styles or stylesheet rules apply to the div that contains the "Drew and Lacey" header. Maybe it has a fixed height that is too small, but there are other possibilities. Best thing is to post the relevant pieces.
__________________
Everytime I try to tell you, the words just come out wrong

**
Some meaningless scribbling of no account

The 4th Realm

Arts and Letters Daily - Get some culture
Markbnj is offline   Reply With Quote
Old 01-23-2013, 08:18 AM   #3
Copenhagen69
Diamond Member
 
Join Date: Feb 2005
Posts: 3,017
Default

If this is the right section it looks like ...




Code:
/*-------navigation-------*/
#nav {
  bottom: 0;
  display: block;
  left: 0;
  position: absolute;
  text-transform: uppercase;
  width: 100%;
  z-index: 1500;
}
#nav h2 {
  display: none;
}
#nav ul {
  float: left;
  padding: 16px 0;
}
#nav ul li {
  background: transparent url(../images/navspace.jpg) no-repeat 100% 50%;
  display: inline;
  font-size: 1em;
  padding: 9px 14px 9px 10px;
  list-style: none;
  margin: 0;
  position: relative;
}
#nav ul li.last {
  background: none;
}
#nav ul li a {
  color: #fff;
  padding: 9px 17px 15px;
  text-shadow: 0px -1px 1px #000;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
}
#nav ul li a:hover,
#nav ul li a.active {
  color: #EF9F20;
}
#nav ul li.expanded a:hover,
#nav ul li.expanded.hover a {
  background: transparent url(../images/navbg.jpg) repeat-x 0 0;
}
#nav ul li ul {
  color: #fff;
  display: none;/*  make sure the submenus aren't visible on load */
  font-size: 0.95em;
  left: 0.95em;
  line-height: 2.5em;
  padding: 0;
  position: absolute;
  top: 2.4em;
  width: 15em;
}
#nav ul li.hover ul {
  display: block;
}
#nav ul li.hover ul li ul,
#nav ul li.hover ul li.hover ul li ul {
  display: none;
}
#nav ul li.hover ul li.hover ul,
#nav ul li.hover ul li.hover ul li.hover ul {
  display: block;
}
#nav ul ul li {
  background: #0b0b0b url(../images/dd-space.jpg) repeat-x scroll 0 100%;
  display: block;
  line-height: 2.5em;
  margin: 0 !important;
  padding: 0;
  position: relative;
  text-align: left;
  width: 15em;
}
#nav ul ul li.last {
  background: #010101;
}
#nav ul li.expanded ul li.expanded a,
#nav ul li.expanded ul li.expanded ul li.expanded a,
#nav li.expanded ul li.expanded a:hover,
#nav li.expanded ul li.expanded ul li.expanded a:hover {
  background: transparent url(../images/ddplus.gif) no-repeat 92% 50%;
}
#nav ul li.expanded ul li a,
#nav ul li.expanded ul ul li a,
#nav ul li.expanded ul ul ul li a,
#nav ul li.expanded ul li.expanded ul li a,
#nav ul li.expanded ul li.expanded ul li a:hover,
#nav ul li.expanded ul li.expanded ul li.expanded ul li a,
#nav ul li.expanded ul li.expanded ul li.expanded ul li a:hover,
#nav li.expanded ul li.expanded li a:hover {
  background: transparent;
  display: block;
  height: auto;
  padding: 2px 15px;
}
#nav li.expanded ul li a:hover,
#nav li.expanded ul ul li a:hover {
  background: transparent;
  color: #EF9F20;
  padding: 2px 15px;
}
#nav li .expanded ul {
  margin: -2.7em 0 0 16em;
}
#nav .block {
  margin: 0;
Copenhagen69 is offline   Reply With Quote
Old 01-23-2013, 10:19 AM   #4
Markbnj
Moderator
Programming
 
Markbnj's Avatar
 
Join Date: Sep 2005
Posts: 10,512
Default

That's the style sheet. Can you also post the markup for the page, or at least the header and nav bar portions?
__________________
Everytime I try to tell you, the words just come out wrong

**
Some meaningless scribbling of no account

The 4th Realm

Arts and Letters Daily - Get some culture
Markbnj is offline   Reply With Quote
Old 01-23-2013, 11:07 AM   #5
Copenhagen69
Diamond Member
 
Join Date: Feb 2005
Posts: 3,017
Default

Quote:
Originally Posted by Markbnj View Post
That's the style sheet. Can you also post the markup for the page, or at least the header and nav bar portions?
It is a theme I picked up for my drupal site ... Where would the markup page be located?

here is there header and nav section ...

Code:
/*--------header--------*/
#header-top {
  color: #999;
  padding: 3px 20px;
  height: 18px;
}
#header-top #member-login {
 color: #333;
 float: right;
}
#header-top a {
  color: #999;
  text-decoration: none;
  padding: 0 3px;
}
#header-top a:hover {
  color: #333;
  text-decoration: underline;
}
#header {
  height: 159px;
  position: relative;
}
#header a {
  color: #222;
  text-decoration: none;
}
#logo {
  padding: 16px 0 0 20px;
}
#logo img {
  float: left;
}
#logo h1#site-name {
  width: auto;
}
#logo h1#site-name a {
  font-size: 1.9em;
  float: left;
  font-weight: lighter;
  padding: 17px 0 0 10px;
  letter-spacing: 1px;
}
/*-------navigation-------*/
#nav {
  bottom: 0;
  padding-top:50px;
  display: block;
  left: 0;
  position: absolute;
  text-transform: uppercase;
  width: 100%;
  z-index: 1500;
}
#nav h2 {
  display: none;
}
#nav ul {
  float: left;
  padding: 16px 0;
}
#nav ul li {
  background: transparent url(../images/navspace.jpg) no-repeat 100% 50%;
  display: inline;
  font-size: 1em;
  padding: 9px 14px 9px 10px;
  list-style: none;
  margin: 0;
  position: relative;
}
#nav ul li.last {
  background: none;
}
#nav ul li a {
  color: #fff;
  padding: 9px 17px 15px;
  text-shadow: 0px -1px 1px #000;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
}
#nav ul li a:hover,
#nav ul li a.active {
  color: #EF9F20;
}
#nav ul li.expanded a:hover,
#nav ul li.expanded.hover a {
  background: transparent url(../images/navbg.jpg) repeat-x 0 0;
  
}
#nav ul li ul {
  color: #fff;
  display: none;/*  make sure the submenus aren't visible on load */
  font-size: 0.95em;
  left: 0.95em;
  line-height: 2.5em;
  padding: 0;
  position: absolute;
  top: 2.4em;
  width: 15em;
}
#nav ul li.hover ul {
  display: block;
}
#nav ul li.hover ul li ul,
#nav ul li.hover ul li.hover ul li ul {
  display: none;
}
#nav ul li.hover ul li.hover ul,
#nav ul li.hover ul li.hover ul li.hover ul {
  display: block;
}
#nav ul ul li {
  background: #0b0b0b url(../images/dd-space.jpg) repeat-x scroll 0 100%;
  display: block;
  line-height: 2.5em;
  margin: 0 !important;
  padding: 0;
  position: relative;
  text-align: left;
  width: 15em;
}
#nav ul ul li.last {
  background: #010101;
}
#nav ul li.expanded ul li.expanded a,
#nav ul li.expanded ul li.expanded ul li.expanded a,
#nav li.expanded ul li.expanded a:hover,
#nav li.expanded ul li.expanded ul li.expanded a:hover {
  background: transparent url(../images/ddplus.gif) no-repeat 92% 50%;
}
#nav ul li.expanded ul li a,
#nav ul li.expanded ul ul li a,
#nav ul li.expanded ul ul ul li a,
#nav ul li.expanded ul li.expanded ul li a,
#nav ul li.expanded ul li.expanded ul li a:hover,
#nav ul li.expanded ul li.expanded ul li.expanded ul li a,
#nav ul li.expanded ul li.expanded ul li.expanded ul li a:hover,
#nav li.expanded ul li.expanded li a:hover {
  background: transparent;
  display: block;
  height: auto;
  padding: 2px 15px;
}
#nav li.expanded ul li a:hover,
#nav li.expanded ul ul li a:hover {
  background: transparent;
  color: #EF9F20;
  padding: 2px 15px;
}
#nav li .expanded ul {
  margin: -2.7em 0 0 16em;
}
#nav .block {
  margin: 0;
}
Copenhagen69 is offline   Reply With Quote
Old 01-23-2013, 11:52 PM   #6
SockHaser
Member
 
Join Date: Jan 2011
Posts: 170
Default

Quote:
Originally Posted by Copenhagen69 View Post
... Where would the markup page be located?
That would be the html portions of the navigation area, hence HyperText Markup Language
SockHaser is offline   Reply With Quote
Old 01-24-2013, 08:52 AM   #7
Ken g6
Elite Member
 
Ken g6's Avatar
 
Join Date: Dec 1999
Location: Colorado
Posts: 8,308
Default

This Is Sparta Drupal! It generates its HTML from deep in cryptic PHP functions. You shouldn't be fiddling with the markup.

In my experience, the theme is generated from within sites/all/themes, though there could be another path being used. Find your theme, then look at the CSS folder within it. There will probably be many CSS files.

Next, you need to find the IDs or classes being used to identify the part of the page you want to modify. Try pressing the F12 key while looking at the page in your browser. If this produces a section with a magnifying glass or arrow pointer button, click that. Then highlight the area you want to inspect and click it. That should give you some idea of the elements you want to modify.

Note: if the above doesn't work, http://getfirebug.com/ and try again.
__________________
Look for really BIG primes with TeAm AnandTech PrimeGrid!
Next race: April 20-23

vBulletin looking run down? Get your script fix here.
Ken g6 is online now   Reply With Quote
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT -5. The time now is 01:46 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2014, vBulletin Solutions, Inc.