html - bootstrap carousel images overflowing the right hand grid col -


i want keep carousel , nav bar in middle 75% of screen laid screen out grid. cant recreate on fiddle if put local you'll see; screenshot: enter image description here see 'block 4' on top of pic, thats col starts

  <div class="col-sm-3">col1 </div>   <div class="col-xs-12 col-sm-6"> carousel goes here </div>   <div class="col-sm-3">col3 </div>

the problem images overflow onto 3rd col, how can carousel stay in middle cell/col?

full code below

   <body>         <!--rows , cols structure -->         <div class="row">           <div class="col-sm-3">block1 </div>           <div class="col-xs-12 col-sm-6">                   <!--carouselstart-->             <div class="container page-content">                 <div class="hero row">                     <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">                       <!-- indicators -->                       <ol class="carousel-indicators">                         <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>                         <li data-target="#carousel-example-generic" data-slide-to="1"></li>                         <li data-target="#carousel-example-generic" data-slide-to="2"></li>                       </ol>                        <!-- wrapper slides -->                       <div class="carousel-inner" role="listbox">                         <div class="item active">                           <img src="img/image1.jpg" alt="image 1 missing" title="image 1">                           <div class="carousel-caption">                             <h3>caption1</h3>                           </div>                         </div>                          <div class="item">                           <img src="img/image2.jpg" alt="image 2 missing" title="image 2">                           <div class="carousel-caption">                             <h3>caption 2</h3>                           </div>                         </div>                          <div class="item">                           <img src="img/image3.jpg" alt="image 3 missing" title="image 3">                           <div class="carousel-caption">                             <h3>caption 2</h3>                           </div>                         </div>                       </div>                        <!-- controls -->                       <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">                         <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>                         <span class="sr-only">previous</span>                       </a>                       <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">                         <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>                         <span class="sr-only">next</span>                       </a>                     </div>                 </div> <!--end hero -->             </div><!--end of container--> <!--nav bar goes here-->           <div class="col-sm-3">block4</div>

update.... used thr chrome dev tools alter css , found if set below 100% fits perfectectly. how do ? enter image description here


Comments

Post a Comment

Popular posts from this blog

Magento/PHP - Get phones on all members in a customer group -

i working on custom magento extension. working around adminhtml part , i've created custom form there. here form code: <?php class vivasindustries_smsnotification_block_adminhtml_sms_sendmass_edit_form extends mage_adminhtml_block_widget_form { public function _preparelayout() { $extensionpath = mage::getmoduledir('js', 'vivasindustries_smsnotification'); $head = $this->getlayout()->getblock('head'); $head->addjs('jquery.js'); $head->addjs('vivas.js'); return parent::_preparelayout(); } protected function _prepareform() { $form = new varien_data_form(array( 'id' => 'edit_form', 'action' => $this->geturl('*/*/save', array('id' => $this->getrequest()->get...
Read more

php - Bypass Geo Redirect for specific directories -

i'm trying bypass redirect specific url within site. wondering if might able help. the code below code use, original urls replaces example.com i'd able access http://example.com/admin without redirect occuring. is there way this, , there way using own ip? function country_geo_redirect() { $country = getenv('http_geoip_country_code'); if ($country == "us" ) { wp_redirect("http://usa.example.com/"); exit; } else if ($country == "gb" ) { wp_redirect("http://uk.example.com/"); exit; } } add_action('init', 'country_geo_redirect'); you can bypass redirection code if server found ip address. if ip address == <my ip address> ' nothing here else country_georedirect() end if
Read more

php - .htaccess mod_rewrite for dynamic url which has domain names -

i want convert url ex:( example.com/link.php?url=facebook.com ) ( example.com/facebook.com.php ) how can using .htaccess. or there other process make job easier ? i tried adding script .htaccess file options +followsymlinks rewriteengine on rewriterule url-(.*)\.htm$ link.php?url=$1 but converting url adding "url-" ( example.com/url-facebook.com.php ) i want remove "url-" , want make ( example.com/facebook.com.php ) rewriteengine on rewritecond %{the_request} ^get.*link\.php\?url\= [nc] rewritecond %{request_uri} !/system/.* [nc] rewriterule (.*?)link\.php\?url\=/*(.*) /$1$2 [r=301,ne,l] not sure how above work edit of used use remove index.php url
Read more