Please explain how you can edit the component area in Bitrix. Pasted your div into the header:

<div id="header"> <div id="topline" style="background-color: #867550; width: 976px; margin: auto; height: 36px;"></div> <div id="topbanner" style="position: relative; left: 10px; margin-bottom: 15px;"> <? $APPLICATION->IncludeFile( '/include/slogan_inc.php', array(), array( 'MODE' => 'html', 'TEMPLATE' => 'page_inc.php', ) ); ?> </div> </div> 

Behind it comes the menu component:

 <?$APPLICATION->IncludeComponent("bitrix:menu", "top", array( "ROOT_MENU_TYPE" => "top", "MENU_CACHE_TYPE" => "Y", "MENU_CACHE_TIME" => "36000000", "MENU_CACHE_USE_GROUPS" => "Y", "MENU_CACHE_GET_VARS" => array( ), "MAX_LEVEL" => "1", "CHILD_MENU_TYPE" => "left", "USE_EXT" => "N", "ALLOW_MULTI_SELECT" => "N" ), false );?> 

But when pointing (in edit mode) to a component with a menu, the area of ​​the component itself (not the menu) spreads up very strongly. How can I reduce the size to the size of the menu?

I attach the screen:

The picture shows how strongly the component field is up.

    1 answer 1

    If the sprawling area of ​​the component does not interfere with editing its parameters, then such a change is not important, since the average user does not see this area.

    You can wrap the Bitrix component in a div and edit this div styles.

    You can copy the menu component template to your template, and edit its code there.