StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Everything you need is inside the div "span12" (class="span12") which is set to 100% width. By arbitrarily placing a color border that you can later remove you can see the area that it covers.</p> <p>Inside you have "span8 pull-left" which wraps your bread crumb gray bar and "span4" which holds the Fun Mode elements. </p> <p>Before trying any fix please remove every property you set inline or with the "!important" tag because they will overwrite whatever you do next and it will be difficult to find out the exact numeric values you need to make this work.</p> <p>Set the borders of these 2 inner divs to different colors for debugging purposes. Float "span8 pull-left" to the left and "span4" to the right in your css file (note that you have to find out which tags and which lines are referencing them in your css file with the developers tool; I have a mobile device which is why I am not giving you the line because it might not be the one you need). Add a clear html element after the closing tag of "span4" and before the closing tag of your "span12" holder like this,</p> <pre><code><br style="clear:both;" /> </code></pre> <p>This is a hack but it works better than adding the clear directly in the css.</p> <p>Then play with the margins and the widths of both inner divs until you achieve your needs to a 100% width. Example, set the left div to 80% and the right div to 20% width. Make sure you remove padding in any of the inner divs and instead play with the margins. Padding is read very differently by every browser and it can cause great headaches when playing with compatibility.</p> <p>Hope it helps!</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

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