Rails Masonry GEM issues with Bootstrap Tab-pane -
i'm using bootstrap tab-pane inside of rails application. inside of each tab want use masonry gem. however, items stacking on top of eachother.
.container %ul.nav.nav-tabs - if @project.user == current_user %li %a{href: new_project_room_path(@project)} <i class='fa fa-plus-circle'></i> add room - @rooms.each |room| %li %a{"data-toggle" => "tab", href: "##{dom_id(room)}"}= room.title .tab-content - @rooms.each |room| .tab-pane{id: dom_id(room)} .container-fluid.page.page-block .masonry-container.centered.transitions-enabled.infinite-scroll.clearfix - room.products.each |product| .box.col3 = product.title
if resize page, display side side, way want them to. how can display time?
also fyi, when use similar code not inside of tab-pane, works fine.
.container-fluid.page.page-block .masonry-container.centered.transitions-enabled.infinite-scroll.clearfix - if current_user.is_designer? = link_to new_project_path .box.col3.create_projects_well#add_project %span.text-center#create_project %i.fa.fa-plus-circle.fa-3x %br add project - @projects.each |project| .box.col3 - if project.image_url != nil = link_to(image_tag(project.image_url, class: "img-responsive opaq"), user_project_path(project.user, project)) - else = link_to(image_tag("150.png", class: "img-responsive opaq"), user_project_path(project.user, project))
try removing fluid.
.container.page.page-block .masonry-container.centered.transitions-enabled.infinite-scroll.clearfix - if current_user.is_designer? = link_to new_project_path .box.col3.create_projects_well#add_project %span.text-center#create_project %i.fa.fa-plus-circle.fa-3x %br add project
according bootstrap fluid grid documentation, "nesting fluid grids bit different: number of nested columns doesn't need match parent. instead, columns reset @ each level because each row takes 100% of parent column."
Comments
Post a Comment