我最近从我之前构建它们的人那里接过了一些hubspot页面。在这个特定的页面上,我有两列 - 一列在左边,一列在右边(有灰色背景)。左列目前的内容比右侧更多,因此右列的灰色背景不会一直向下延伸到页面,而是停在其自己内容的底部。没什么大不了的?我只会使用clearfix ..但是clearfix什么都不做。好的,我只会使用JavaScript ...但在尝试不同的脚本后,它也无法正常工作。我试过了clearfix hack的多个版本。
有人可以帮我从右栏中获得这个灰色背景,一直延伸到页面底部(与左栏相同的高度)?我会欠你的债!
以下是页面:http://info.brushresearch.com/end-brushes
这是我使用的最新CSS代码:
.z-clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.z-clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .z-clearfix { height: 1%; }
.z-clearfix { display: block; }
/* close commented backslash hack */
这是我正在使用的基本HTML ...
<div class="z-clearfix">
<div class="span12 widget-span widget-type-cell page-center content-wrapper" style="padding-bottom: 0px;" data-widget-type="cell" data-x="0" data-w="12">
<div class="row-fluid-wrapper row-depth-1 row-number-2 ">
<div class="row-fluid ">
<div class="span6 widget-span widget-type-cell main-content" style="padding: 20px 0;" data-widget-type="cell" data-x="0" data-w="6">
<div class="row-fluid-wrapper row-depth-1 row-number-3 ">
<div class="row-fluid ">
<div class="span12 widget-span widget-type-widget_container " style="" data-widget-type="widget_container" data-x="0" data-w="12">
<span id="hs_cos_wrapper_module_1395325065960295" class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" style="" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><div id="hs_cos_wrapper_widget_2876866323" class="hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_rich_text" style="" data-hs-cos-general-type="widget" data-hs-cos-type="rich_text"><h2>Power Brushes for Small, Tight, And Hard-to-Reach Spaces</h2>
<h3>End Brushes</h3>
<p><br><img src="//cdn2.hubspot.net/hub/484035/hubfs/Landing_Pages/End_Brushes.jpg?t=1458145818376&width=230" alt="End Brushes" title="End Brushes" width="230" data-constrained="true" style="width: 230px; float: left; margin: 0px 10px 0px 0px;">End brushes are used for cleaning, blending, polishing, deburring, and surface finishing recessed areas.</p>
<p>Industrial and automotive applications include cleaning parts, polishing dies, and removing carbon deposits from piston heads, cylinders, and valve seats.</p>
<h4>Types of End Brushes</h4>
<p><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container">Brush Research Manufacturing (BRM) supplies these types of end brushes:</span></p>
<ul>
<li><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><strong>Solid Wire</strong> for blending, cleaning, and polishing</span></span></li>
<li><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><strong>Knotted</strong> <strong>Wire</strong> for added aggressiveness</span></span></span></li>
<li><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><span class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><strong>Circular Flared</strong> for side cutting action</span></span></span></span></li>
</ul>
<p>Most end brushes have carbon steel or stainless steel filaments. Nylon, abrasive nylon, and brass filaments are available for some solid end brushes.</p>
<p>End brushes also differ in terms of end-style. Brushes with standard ends are great for general-purpose use. Banded tools have less trim and produce less flare. End brushes with coated cups protect the workpiece from contact with the metal body. </p>
<h4>Which End Brush Do You Need?</h4>
<p>Which end brush is right for your application? <span>Watch the video and download the BRM Product Catalog to learn more.</span></p>
<div><iframe src="//www.youtube.com/embed/gm624K5y79k" width="425" height="350"></iframe></div></div></span>
</div><!--end widget-span -->
</div><!--end row-->
</div><!--end row-wrapper -->
</div><!--end widget-span -->
<div class="span6 widget-span widget-type-widget_container sidebar right" style="background: #ececec;padding: 20px 80px;/*padding-bottom:30em;*/" data-widget-type="widget_container" data-x="6" data-w="6">
<span id="hs_cos_wrapper_module_14019004881245786" class="hs_cos_wrapper hs_cos_wrapper_widget_container hs_cos_wrapper_type_widget_container" style="" data-hs-cos-general-type="widget_container" data-hs-cos-type="widget_container"><div id="hs_cos_wrapper_module_13885068285937553" class="hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_form" style="" data-hs-cos-general-type="widget" data-hs-cos-type="form"><h3 id="hs_cos_wrapper_module_13885068285937553_title" class="hs_cos_wrapper form-title" data-hs-cos-general-type="widget_field" data-hs-cos-type="text">Download The BRM Product Catalog</h3>
<div id="hs_form_target_module_13885068285937553"><form novalidate="" accept-charset="UTF-8" action="https://forms.hubspot.com/uploads/form/v2/484035/67fcbcac-a5a7-44f8-93c3-81bfcc503887" enctype="multipart/form-data" id="hsForm_67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" method="POST" class="hs-form stacked hs-custom-form" data-form-id="67fcbcac-a5a7-44f8-93c3-81bfcc503887" data-reactid=".0"><fieldset class="form-columns-2" data-reactid=".0.1:$0"><div class="hs_firstname field hs-form-field" data-reactid=".0.1:$0.1:$firstname"><label class="" placeholder="Enter your First Name" for="firstname-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$0.1:$firstname.0"><span data-reactid=".0.1:$0.1:$firstname.0.0">First Name</span><span class="hs-form-required" data-reactid=".0.1:$0.1:$firstname.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$0.1:$firstname.1"></legend><div class="input" data-reactid=".0.1:$0.1:$firstname.$firstname"><input id="firstname-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="text" name="firstname" required="" value="" placeholder="" data-reactid=".0.1:$0.1:$firstname.$firstname.0"></div></div><div class="hs_lastname field hs-form-field" data-reactid=".0.1:$0.1:$lastname"><label class="" placeholder="Enter your Last Name" for="lastname-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$0.1:$lastname.0"><span data-reactid=".0.1:$0.1:$lastname.0.0">Last Name</span><span class="hs-form-required" data-reactid=".0.1:$0.1:$lastname.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$0.1:$lastname.1"></legend><div class="input" data-reactid=".0.1:$0.1:$lastname.$lastname"><input id="lastname-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="text" name="lastname" required="" value="" placeholder="" data-reactid=".0.1:$0.1:$lastname.$lastname.0"></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$1"><div class="hs_company field hs-form-field" data-reactid=".0.1:$1.1:$company"><label class="" placeholder="Enter your Company Name" for="company-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$1.1:$company.0"><span data-reactid=".0.1:$1.1:$company.0.0">Company Name</span><span class="hs-form-required" data-reactid=".0.1:$1.1:$company.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$1.1:$company.1"></legend><div class="input" data-reactid=".0.1:$1.1:$company.$company"><input id="company-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="text" name="company" required="" value="" placeholder="" data-reactid=".0.1:$1.1:$company.$company.0"></div></div></fieldset><fieldset class="form-columns-2" data-reactid=".0.1:$2"><div class="hs_phone field hs-form-field" data-reactid=".0.1:$2.1:$phone"><label class="" placeholder="Enter your Phone Number" for="phone-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$2.1:$phone.0"><span data-reactid=".0.1:$2.1:$phone.0.0">Phone Number</span><span class="hs-form-required" data-reactid=".0.1:$2.1:$phone.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$2.1:$phone.1"></legend><div class="input" data-reactid=".0.1:$2.1:$phone.$phone"><input id="phone-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="tel" name="phone" required="" value="" placeholder="" data-reactid=".0.1:$2.1:$phone.$phone.0"></div></div><div class="hs_email field hs-form-field" data-reactid=".0.1:$2.1:$email"><label class="" placeholder="Enter your Email" for="email-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$2.1:$email.0"><span data-reactid=".0.1:$2.1:$email.0.0">Email</span><span class="hs-form-required" data-reactid=".0.1:$2.1:$email.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$2.1:$email.1"></legend><div class="input" data-reactid=".0.1:$2.1:$email.$email"><input id="email-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="email" name="email" required="" placeholder="" value="" data-reactid=".0.1:$2.1:$email.$email.0"></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$3"><div class="hs_address field hs-form-field" data-reactid=".0.1:$3.1:$address"><label class="" placeholder="Enter your Street Address" for="address-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$3.1:$address.0"><span data-reactid=".0.1:$3.1:$address.0.0">Street Address</span><span class="hs-form-required" data-reactid=".0.1:$3.1:$address.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$3.1:$address.1"></legend><div class="input" data-reactid=".0.1:$3.1:$address.$address"><input id="address-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="text" name="address" required="" value="" placeholder="" data-reactid=".0.1:$3.1:$address.$address.0"></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$4"><div class="hs_city field hs-form-field" data-reactid=".0.1:$4.1:$city"><label class="" placeholder="Enter your City" for="city-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$4.1:$city.0"><span data-reactid=".0.1:$4.1:$city.0.0">City</span><span class="hs-form-required" data-reactid=".0.1:$4.1:$city.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$4.1:$city.1"></legend><div class="input" data-reactid=".0.1:$4.1:$city.$city"><input id="city-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="text" name="city" required="" value="" placeholder="" data-reactid=".0.1:$4.1:$city.$city.0"></div></div></fieldset><fieldset class="form-columns-2" data-reactid=".0.1:$5"><div class="hs_state field hs-form-field" data-reactid=".0.1:$5.1:$state"><label class="" placeholder="Enter your State/Region" for="state-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$5.1:$state.0"><span data-reactid=".0.1:$5.1:$state.0.0">State/Region</span><span class="hs-form-required" data-reactid=".0.1:$5.1:$state.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$5.1:$state.1"></legend><div class="input" data-reactid=".0.1:$5.1:$state.$state"><input id="state-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="text" name="state" required="" value="" placeholder="" data-reactid=".0.1:$5.1:$state.$state.0"></div></div><div class="hs_zip field hs-form-field" data-reactid=".0.1:$5.1:$zip"><label class="" placeholder="Enter your Postal Code" for="zip-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$5.1:$zip.0"><span data-reactid=".0.1:$5.1:$zip.0.0">Postal Code</span><span class="hs-form-required" data-reactid=".0.1:$5.1:$zip.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$5.1:$zip.1"></legend><div class="input" data-reactid=".0.1:$5.1:$zip.$zip"><input id="zip-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="text" name="zip" required="" value="" placeholder="" data-reactid=".0.1:$5.1:$zip.$zip.0"></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$6"><div class="hs_country field hs-form-field" data-reactid=".0.1:$6.1:$country"><label class="" placeholder="Enter your Country" for="country-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$6.1:$country.0"><span data-reactid=".0.1:$6.1:$country.0.0">Country</span><span class="hs-form-required" data-reactid=".0.1:$6.1:$country.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$6.1:$country.1"></legend><div class="input" data-reactid=".0.1:$6.1:$country.$country"><input id="country-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" type="text" name="country" required="" value="" placeholder="" data-reactid=".0.1:$6.1:$country.$country.0"></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$7"><div class="hs_hs_persona field hs-form-field" data-reactid=".0.1:$7.1:$hs_persona"><label class="" placeholder="Enter your Customer Type" for="hs_persona-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$7.1:$hs_persona.0"><span data-reactid=".0.1:$7.1:$hs_persona.0.0">Customer Type</span><span class="hs-form-required" data-reactid=".0.1:$7.1:$hs_persona.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$7.1:$hs_persona.1"></legend><div class="input" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona"><select id="hs_persona-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" required="" class="hs-input" name="hs_persona" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona.0"><option value="" disabled="" selected="" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona.0.0">- select -</option><option value="persona_1" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona.0.1:$persona_1">Industrial Manufacturer</option><option value="persona_2" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona.0.1:$persona_2">Industrial Distributor</option><option value="persona_3" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona.0.1:$persona_3">Automotive End-User</option><option value="persona_4" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona.0.1:$persona_4">Firearms End-User</option><option value="persona_5" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona.0.1:$persona_5">Automotive Distributor</option><option value="persona_6" data-reactid=".0.1:$7.1:$hs_persona.$hs_persona.0.1:$persona_6">Other</option></select></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$8"><div class="hs_industry_dropdown field hs-form-field" data-reactid=".0.1:$8.1:$industry_dropdown"><label class="" placeholder="Enter your Application" for="industry_dropdown-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$8.1:$industry_dropdown.0"><span data-reactid=".0.1:$8.1:$industry_dropdown.0.0">Application</span><span class="hs-form-required" data-reactid=".0.1:$8.1:$industry_dropdown.0.1">*</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$8.1:$industry_dropdown.1"></legend><div class="input" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown"><select id="industry_dropdown-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" required="" class="hs-input" name="industry_dropdown" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0"><option value="" disabled="" selected="" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.0">- select -</option><option value="Aerospace" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Aerospace">Aerospace</option><option value="Automotive" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Automotive">Automotive</option><option value="Earth Moving Equipment" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Earth Moving Equipment">Earth Moving Equipment</option><option value="Firearms" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Firearms">Firearms</option><option value="Forming and Fabricating" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Forming and Fabricating">Forming and Fabricating</option><option value="Fluid Power" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Fluid Power">Fluid Power</option><option value="General Industrial Manufacturing" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$General Industrial Manufacturing">General Industrial Manufacturing</option><option value="Hydraulics" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Hydraulics">Hydraulics</option><option value="Marine" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Marine">Marine</option><option value="Metalworking" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Metalworking">Metalworking</option><option value="MRO" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$MRO">MRO</option><option value="Musical Instruments" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Musical Instruments">Musical Instruments</option><option value="Oil and Gas" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Oil and Gas">Oil and Gas</option><option value="Welding" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Welding">Welding</option><option value="Military" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Military">Military</option><option value="Other" data-reactid=".0.1:$8.1:$industry_dropdown.$industry_dropdown.0.1:$Other">Other</option></select></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$9"><div class="hs_comments field hs-form-field" data-reactid=".0.1:$9.1:$comments"><label class="" placeholder="Enter your Comments" for="comments-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$9.1:$comments.0"><span data-reactid=".0.1:$9.1:$comments.0.0">Comments</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$9.1:$comments.1"></legend><div class="input" data-reactid=".0.1:$9.1:$comments.$comments"><textarea id="comments-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" class="hs-input" name="comments" placeholder="" data-reactid=".0.1:$9.1:$comments.$comments.0"></textarea></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$10"><div class="hs_lifecyclestage field hs-form-field" style="display:none;" data-reactid=".0.1:$10.1:$lifecyclestage"><label class="" placeholder="Enter your Lifecycle Stage" for="lifecyclestage-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$10.1:$lifecyclestage.0"><span data-reactid=".0.1:$10.1:$lifecyclestage.0.0">Lifecycle Stage</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$10.1:$lifecyclestage.1"></legend><div class="input" data-reactid=".0.1:$10.1:$lifecyclestage.$lifecyclestage"><input name="lifecyclestage" class="hs-input" type="hidden" value="marketingqualifiedlead" data-reactid=".0.1:$10.1:$lifecyclestage.$lifecyclestage.0"></div></div></fieldset><fieldset class="form-columns-1" data-reactid=".0.1:$11"><div class="hs_campaign field hs-form-field" style="display:none;" data-reactid=".0.1:$11.1:$campaign"><label class="" placeholder="Enter your Campaign" for="campaign-67fcbcac-a5a7-44f8-93c3-81bfcc503887_8120" data-reactid=".0.1:$11.1:$campaign.0"><span data-reactid=".0.1:$11.1:$campaign.0.0">Campaign</span></label><legend class="hs-field-desc" style="display:none;" data-reactid=".0.1:$11.1:$campaign.1"></legend><div class="input" data-reactid=".0.1:$11.1:$campaign.$campaign"><input name="campaign" class="hs-input" type="hidden" value="Website" data-reactid=".0.1:$11.1:$campaign.$campaign.0"></div></div></fieldset><div class="hs_submit" data-reactid=".0.3"><div class="hs-field-desc" style="display:none;" data-reactid=".0.3.0"></div><div class="actions" data-reactid=".0.3.1"><input type="submit" value="Submit" class="hs-button primary large" data-reactid=".0.3.1.0"></div></div><input name="hs_context" type="hidden" value="{"pageUrl":"http://info.brushresearch.com/end-brushes","pageTitle":"End Brushes| Power Brushes | BRM","isHostedOnHubspot":true,"timestamp":1458148249926,"userAgent":"Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/49.0.2623.87 Safari/537.36","referrer":"http://stackoverflow.com/questions/36018345/why-is-clearfix-not-working-on-this-column","hutk":"d54500098a6cf0a8c80e3558e469aada","originalEmbedContext":{"portalId":"484035","formId":"67fcbcac-a5a7-44f8-93c3-81bfcc503887","formInstanceId":"8120","pageId":3854020261,"pageName":"End Brushes| Power Brushes | BRM","redirectUrl":"http://info.brushresearch.com/brm-product-catalog-thank-you","css":"","target":"#hs_form_target_module_13885068285937553","contentType":"landing-page","formData":{"cssClass":"hs-form stacked hs-custom-form"}},"formName":"Request Literature Catalog, Flex-Hone, & Nampower","recentFieldsCookie":{},"pageId":"3854020261","pageName":"End Brushes| Power Brushes | BRM","boolCheckBoxFields":"","dateFields":"","redirectUrl":"http://info.brushresearch.com/brm-product-catalog-thank-you","formInstanceId":"8120","smartFields":{},"urlParams":{},"formValidity":{}}" data-reactid=".0.4"></form></div>
以下是hubspot模板页面后端的屏幕截图:
答案 0 :(得分:0)
您可以在父元素中添加类:
<div class="row-fluid " style="position: relative;">
你可以为你的侧边栏做到这一点:
element.style {
background: #ececec;
padding: 20px 80px;
position: absolute;
right: 0;
height: 100%;
/* padding-bottom: 30em; */
}
我尝试了它的作品。
希望有所帮助
答案 1 :(得分:0)
感谢您的帮助。所以,为了澄清,我将.row-fluid类添加到具体的元素中?
然后我将提供的CSS代码应用于.sidebar.right?