HTML Logo by World Wide Web Consortium (www.w3.org). Click to learn more about our commitment to accessibility and standards.

Moving forward with Composr

ocPortal has been relaunched as Composr CMS, which is now in beta. ocPortal 9 will be superseded by Composr 10.

Head over to compo.sr for our new site, and to our migration roadmap. Existing ocPortal member accounts have been mirrored.


Grouping / Connecting the Menu's together

Login / Search

 [ Join | More ]
 Add topic 
Posted
Rating:
#90438 (In Topic #18278)
Avatar

Fan in training

Desperately needs help




Hey guys the website I own is http://shaywin.com/ it's the website at the top and I was wondering how do I make it so the Menu's on my website have their menu's connected like the website at the bottom. I really dislike how it's all spaced out and I was wondering if any of you could help me fix this. Thanks. :|

Back to the top
 
Posted
Rating:
#90440
Avatar

Well-settled

Two possibilities come to mind for me:

1) You have an [ENTER] in the left column section between each menu block.

2) The CSS is set with a cell buffer value that you need to change.

The bottom site looks like an older version of OCP, and so presumably has the old less CSS-controlled interface.
Back to the top
 
Posted
Rating:
#90441
Avatar

Fan in training

D-Train said

Two possibilities come to mind for me:

1) You have an [ENTER] in the left column section between each menu block.

2) The CSS is set with a cell buffer value that you need to change.

The bottom site looks like an older version of OCP, and so presumably has the old less CSS-controlled interface.

Nah I didn't use any enters and I didn't screen shot the the bottom of the site. How can I change the Cell Buffer value I don't what that is yet. Thanks for the reply.
Back to the top
 
Posted
Rating:
#90445
Avatar

Community saint

Shaywin said

Nah I didn't use any enters
You have a space between the sections, which is either before the [block] or after the [/block] . That will have a similar effect.
How can I change the Cell Buffer value I don't what that is yet.
Change the "margin:" in the ".box" class of the css.


Do you have a Samsung Galaxy S / Galaxy S II ? If so, why not check out my ScreenFree FM Radio .
Back to the top
 
Posted
Rating:
#90448
Avatar

Fan in training

temp1024 said

Shaywin said

Nah I didn't use any enters
You have a space between the sections, which is either before the [block] or after the [/block] . That will have a similar effect.
How can I change the Cell Buffer value I don't what that is yet.
Change the "margin:" in the ".box" class of the css.

I checked didn't see space between the section. However I tried to locate .box class in CSS and couldn't find it. Need help
Back to the top
 
Posted
Rating:
#90449
Avatar

Community saint

Shaywin said

I checked didn't see space between the section.
Can you please post the entire text of the left column (i.e. from the zone editor) here. Make sure to enclose it in a [code] [/code] tag so all formatting is preserved.

If we find nothing out of the ordinary there then it will probably be with the box template.
However I tried to locate .box class in CSS and couldn't find it.
Did you look with the ocportal CSS editor (i.e. Admin Zone Style Manage themes Choose / Edit CSS (styles) )?.

It should look something like this:

Code

.box {
    background: -moz-linear-gradient(to bottom, #E7FAE9, #D3F6D6) repeat scroll 0 0 #E7FAE9;
    border: 1px solid #84C68B;
    border-radius: 5px 5px 5px 5px;
    margin: 1em 0;
    overflow: hidden;
}
except all colours (e.g. #E7FAE9) will be replaced with variable names.


Do you have a Samsung Galaxy S / Galaxy S II ? If so, why not check out my ScreenFree FM Radio .
Back to the top
 
Posted
Rating:
#90503

Non-joined user

I looked in the menu_editor.css no .box in there. Is that the right file? If not was is it?
Back to the top
 
Posted
Rating:
#90504
Avatar

Fan in training

temp1024 said

Shaywin said

I checked didn't see space between the section.
Can you please post the entire text of the left column (i.e. from the zone editor) here. Make sure to enclose it in a [code] [/code] tag so all formatting is preserved.

If we find nothing out of the ordinary there then it will probably be with the box template.
However I tried to locate .box class in CSS and couldn't find it.
Did you look with the ocportal CSS editor (i.e. Admin Zone Style Manage themes Choose / Edit CSS (styles) )?.

It should look something like this:

Code

.box {
    background: -moz-linear-gradient(to bottom, #E7FAE9, #D3F6D6) repeat scroll 0 0 #E7FAE9;
    border: 1px solid #84C68B;
    border-radius: 5px 5px 5px 5px;
    margin: 1em 0;
    overflow: hidden;
}
except all colours (e.g. #E7FAE9) will be replaced with variable names.

I looked in the menu_editor.css no .box in there. Is that the right file? If not was is it?
Back to the top
 
Posted
Rating:
#90513
Avatar

Community saint

The .box css code is in the global.css file. Find the .box css class and change this line:

 ​

Code

 margin: 1em 0;
 


 and comment that line out by changing it to:
 ​

Code

 /* margin: 1em 0; */
 


 Be aware that this will remove the spacing from all boxes and not just the ones the menus are in. I'm not a CSS wizard, so I couldn't tell you if you can make other changes to the CSS to only affect the menus, but there is a template where you can make a single change to affect only the side panel menus.  You can change the side panel menus by editing the BLOCK_SIDE_STORED_MENU.tpl template file.  Change the first line from this:

 ​

Code

<section class="box box___block_side_stored_menu_{TYPE*}"><div class="box_inner">
 

 to this:
 ​

Code

<section class="box box___block_side_stored_menu_{TYPE*}" style="margin:0"><div class="box_inner">
 

Back to the top
 
Posted
Rating:
#90722
Avatar

Fan in training

I tried the changes and still couldn't get it to work.

Jason Verhagen said

The .box css code is in the global.css file. Find the .box css class and change this line:

 ​

Code

 margin: 1em 0;
 


 and comment that line out by changing it to:
 ​

Code

 /* margin: 1em 0; */
 


 Be aware that this will remove the spacing from all boxes and not just the ones the menus are in. I'm not a CSS wizard, so I couldn't tell you if you can make other changes to the CSS to only affect the menus, but there is a template where you can make a single change to affect only the side panel menus.  You can change the side panel menus by editing the BLOCK_SIDE_STORED_MENU.tpl template file.  Change the first line from this:

 ​

Code

<section class="box box___block_side_stored_menu_{TYPE*}"><div class="box_inner">
 

 to this:
 ​

Code

<section class="box box___block_side_stored_menu_{TYPE*}" style="margin:0"><div class="box_inner">
 



Back to the top
 
Posted
Rating:
#90724
Avatar

Community saint

I wonder if CSS is compiled into the cached templates and you need to clear the cache... not sure about that.

Paul
Back to the top
 
Posted
Rating:
#90725
Avatar

Community saint

Those changes did make a difference, but you may not have noticed it because there are still spaces between the blocks which are adding the gap.

When I look at the html code I can see a space (&nbsp;) between the two sections. Here:

Code

</div></section>&nbsp;<section style="margin:0" class="box box___block_side_stored_menu_embossed"><div class="box_inner">
and here:

Code

</div></section>&nbsp;

<section class="box box___block_main_newsletter_signup"><div class="box_inner">
Note also that as the newsletter box is not a menu, the style="margin:0" you added won't apply to it, so there will still be a little gap there that will need to be.
 
Sorry I can't be more specific as to where the changes need to be made, but I'm not familiar with the template/css changes made to v9.

Do you have a Samsung Galaxy S / Galaxy S II ? If so, why not check out my ScreenFree FM Radio .
Back to the top
 
Posted
Rating:
#90726
Avatar

Community saint

Arbo said

I wonder if CSS is compiled into the cached templates and you need to clear the cache… not sure about that.
CSS files are are compiled, minified and cached.

Cache flushing does not appear to be the issue here as I can see the style="margin:0" changes that were made.

Do you have a Samsung Galaxy S / Galaxy S II ? If so, why not check out my ScreenFree FM Radio .
Back to the top
 
There are too many online users to list.
Control functions:

Quick reply   Contract

Your name:
Your message: