Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>you pick which corner you would like to have curved. : lots of css ahead, but it will give you insights into what you can do.</p> <p>css:</p> <pre><code>aside { border: 1px solid #CCCC00; border-radius: 10px; padding: 5px 20px 20px 20px; width: 290px; margin: 50px; position:relative; } .upper-left { border-right: 1px solid #CCCC00; border-top: 1px solid #CCCC00; border-top-right-radius: 10px; width:15px; height:25px; top: -1px; right:50px; position:absolute; z-index:10; } .bottom-left { border-left: 1px solid #CCCC00; border-bottom: 1px solid #CCCC00; border-bottom-left-radius: 10px; width:20px; height:25px; top: 25px; right:30px; position:absolute; z-index:10; background:#fff; } .bottom-right { border-right: 1px solid #CCCC00; border-top: 1px solid #CCCC00; border-top-right-radius: 10px; width:30px; height:25px; top: 50px; right:-1px; position:absolute; z-index:10; background:#fff; } </code></pre> <p>html:</p> <pre><code>&lt;aside&gt; &lt;h2&gt;Product in de kijker&lt;/h2&gt; &lt;h3&gt;Mobiele telefonie&lt;/h3&gt; &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.&lt;/p&gt; &lt;a href="#" class="btn btn-runa"&gt;Ga verder&lt;/a&gt; &lt;div class="upper-left"&gt;&lt;/div&gt; &lt;div class="bottom-left"&gt;&lt;/div&gt; &lt;div class="bottom-right"&gt;&lt;/div&gt; &lt;/aside&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    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. This table or related slice is empty.
 

Querying!

 
Guidance

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