Databases
StackOverflow2013
Postsdbo
POBootstrap 2.3.2: Using CSS to wrap featurettes in another container?
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POBootstrap 2.3.2: Using CSS to wrap featurettes in another container?
    primarykey
    data
    text
    <p>So I have the following code, taken from the source code in <a href="http://getbootstrap.com/2.3.2/examples/carousel.html" rel="nofollow noreferrer">this example.</a></p> <pre><code>&lt;div class="container marketing"&gt; &lt;hr class="featurette-divider"&gt; &lt;!-- START THE FEATURETTES --&gt; &lt;div class="featurette"&gt; &lt;img class="featurette-image pull-right" src=&lt;%= asset_path("akpsi_color_200.png")%&gt;&gt; &lt;br /&gt; &lt;h2 class="featurette-heading"&gt;Alpha Kappa Psi: &lt;span class="muted"&gt;Established in 1904&lt;/span&gt;&lt;/h2&gt; &lt;p class="lead"&gt;Alpha Kappa Psi Fraternity is the world's &lt;i&gt;oldest&lt;/i&gt; and &lt;i&gt;largest&lt;/i&gt; professional fraternity, with an international network spanning across all geographies, careers, and backgrounds. &lt;br /&gt; &lt;br /&gt;We provide our brothers with professional guidance throughout their college years to ensure that upon graduation, we are each equipped with a skill set necessary to survive in any work environment. &lt;/p&gt; &lt;/div&gt; &lt;hr class="featurette-divider"&gt; &lt;div class="featurette"&gt; &lt;img class="featurette-image pull-left" src=&lt;%= asset_path("akpsi_color_200.png")%&gt;&gt; &lt;h2 class="featurette-heading"&gt;Why AKΨ? &lt;span class="muted"&gt;See for yourself.&lt;/span&gt;&lt;/h2&gt; &lt;p class="lead"&gt;Cal is a big place, and it's easy to feel as if you are just a face in a large crowd. But there are many professional fraternities and clubs which can be your "home" in the University. By joining a group such as Alpha Kappa Psi, you'll have an instant network of peers and alumni who've faced the same challenges as you and who are ready to help you with your career.&lt;/p&gt; &lt;/div&gt; &lt;hr class="featurette-divider"&gt; &lt;/div&gt;&lt;!-- /.container --&gt; </code></pre> <p>What I want to do is place both of these featurettes in a box with a bit of padding on the sides -- here's my stylesheet for the box:</p> <pre><code>.account-wall-static { margin-top: 20px; padding: 40px 40px 40px 40px; background-color: #f7f7f7; -moz-box-shadow: -5px 0 2px -5px rgba(0, 0, 0, 0.3), 5px 0 2px -5px rgba(0, 0, 0, 0.3); -webkit-box-shadow: -5px 0 2px -5px rgba(0, 0, 0, 0.3), 5px 0 2px -5px rgba(0, 0, 0, 0.3); box-shadow: -5px 0 2px -5px rgba(0, 0, 0, 0.3), 5px 0 2px -5px rgba(0, 0, 0, 0.3); } </code></pre> <p>So what I did was simply place another <code>div class="account-wall-static"</code> tag outside of the <code>div class="container marketing"</code> tag. However, this is the result:</p> <p><img src="https://i.stack.imgur.com/swzzW.png" alt="enter image description here"></p> <p>The content is leaking out of the right side of the box. It seems like the padding on the right isn't being detected or I'm not coding it correctly; what is the correct way to do this?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USRyan Yu
    1. USRyan Yu
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. COcan you add a fiddle?
      singulars
      1. POBootstrap 2.3.2: Using CSS to wrap featurettes in another container?
      1. USSurjith S M
    2. COThe formatting (i.e. the right-padding) works without Bootstrap so I don't think this would do much good -- but something in one of the Bootstrap defined classes is interfering with it, I think... and I can't figure out what it is.
      singulars
      1. POBootstrap 2.3.2: Using CSS to wrap featurettes in another container?
      1. USRyan Yu
    3. COThat's why. If we can see your live code, Its easier to debug.
      singulars
      1. POBootstrap 2.3.2: Using CSS to wrap featurettes in another container?
      1. USSurjith S M
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload