Hi I'm really new to Drupal, and I have looked through all the settings and the CSS files before posting this. Basically on my horizontal menu bar, I have one too many links. So the last link goes on to the line below, which doesn't look right.

Does anyone have any ideas on how to increase the page size so they will all fit on the same line, or to shrink them to do the same thing..

Apologies if this as already been posted, I did have a look before posting this but couldn't find anything similar to my problem

Many Thanks

Comments

gtsopour’s picture

Assigned: Jon_90 » gtsopour
Category: feature » support
Issue tags: +Corporate Theme, +Corporate Clean Theme, +CorporateClean, +Corporate Clean theme Menu
gtsopour’s picture

Hello Jon_90,

in your case, you should only reduce the distance (css margin) between Main menu items. The easy (but dirty) solution is to directly change the margin value into style.css (sites/all/themes/corporateclean/style.css) file,

style.css Line 208

Change from

#header-menu ul.menu li a { outline:none; text-decoration: none; margin:0 35px 0 0; font-size:14px; font-weight:normal; text-align:center; text-transform:uppercase; 
font-family: Myriad Pro,"Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif; display:block; }

to

#header-menu ul.menu li a { outline:none; text-decoration: none; margin:0 15px 0 0; font-size:14px; font-weight:normal; text-align:center; text-transform:uppercase; 
font-family: Myriad Pro,"Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif; display:block; }

But on the other hand, the right and clean way to do this is to create a new local.css file. The following brief guide will demonstrate how to setup Corporate Clean theme to support a local.css file where custom CSS rules and modifications could be placed. Following this practise, there is no worry if the next theme update will override all your custom changes (such the the one above inside style.css).

This can be done in 3 simple steps:

  1. Create an empty .css file under the /sites/all/themes/corporateclean path and name it as you wish. local.css is always a good choice.
  2. Edit the corporateclean.info file and add a line like stylesheets[all][] = local.css after stylesheets[all][] = color/colors.css
  3. Clear all cached data.
    This step is important in order to force your template to be informed for the changes you have made in the template files. To do this go to Administer » Site configuration » Performance » Clear cached data

Finally, your corporateclean.info file will contain the following code

name = CorporateClean
description = CorporateClean: A flexible, recolorable theme with many regions.
version = VERSION
core = 7.x

stylesheets[all][] = style.css
stylesheets[all][] = color/colors.css
stylesheets[all][] = local.css

regions[search_area] = Search area
regions[highlighted] = Highlighted
regions[content] = Content
regions[sidebar_first] = First sidebar
regions[banner] = Banner
regions[footer_first] = Footer first
regions[footer_second] = Footer second
regions[footer_third] = Footer third
regions[footer] = Footer
regions[footer_bottom_right] = Footer bottom right
regions[help] = Help
regions[page_top] = Page top
regions[page_bottom] = Page bottom

settings[breadcrumb_display]= 1
settings[slideshow_display]= 1
settings[slideshow_effect]='scrollHorz'
settings[slideshow_effect_time]='10'

project = "corporateclean"

Now, you can edit the local.css file and add your style rules which will override the margin value of Main menu item links. In order to accomplish this, you should add the following code inside local.css.

#header-menu ul.menu li a { margin:0 15px 0 0; }

Thanks
/George

gtsopour’s picture

Version: 7.x-1.2 » 7.x-1.4
news4u’s picture

is is the same procedure if changing or increasing the page size/dimension ?