Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I think that what do you want is almost impossible with just pure HTML + CSS. </p> <p>What may work for you is something like this one I did: <a href="http://jsfiddle.net/fmZAm/" rel="nofollow">http://jsfiddle.net/fmZAm/</a></p> <p>HTML:</p> <pre><code>&lt;div class="main"&gt; &lt;div class="left"&gt;&lt;/div&gt; &lt;div class="right"&gt; &lt;div class="fixed_content"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>CSS:</p> <pre><code>div.main { min-height: 500px; /* force some height */ min-width: 300px; /* min width to show content */ text-align: center; /* center content when in vertical responsive mode */ font-size: 0px; /* remove blank space from 'inline-block' display */ } div.main &gt; div /* left and right divs */ { width: 100%; /* force both to have as max width as possible */ min-height: inherit; /* same min height as parent */ min-width: inherit; /* same min width as parent to show content */ display: inline-block; } div.left { max-width: 58%; /* 100% width from max of 58% parent width */ background-color: lightgreen; } div.right { max-width: 42%; /* 100% width from max of 42% parent width */ text-align: right; /* put child 'inline-block' divs to the right */ background-color: dodgerblue; } div.right &gt; div.fixed_content { width: 300px; /* set the 300px right div you want */ min-height: inherit; /* same min height as parent */ background: orange; display: inline-block; } </code></pre> <p>As both divs (left and right) will have % widths, both will resize based on the current max width, but you'll have your fixed width div inside of the right div. So, when your right div resize to 300px width (the fixed with of its child div) it will go below the left div.</p> <p>Hope it helps!</p>
    singulars
    1. This table or related slice is empty.
    1. POHow to make 2 divs float, left div with fixed right margin?
      singulars
      1. PTQuestion
    1. PTAnswer
    1. This table or related slice is empty.
    1. USFelypp Oliveira
    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. COthanks for answer, but this is not what I am looking for. I need left div to have auto width. But in your example it is fixed width. It doesn't help me a lot..
      singulars
      1. PO
      1. USFrodik
 

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