mirror of
https://github.com/penpot/penpot-docs.git
synced 2024-07-06 05:41:47 +00:00
commit
a265ae1278
|
@ -60,8 +60,8 @@ title: 08· Flexible Layouts
|
||||||
<h4>Position static:</h4>
|
<h4>Position static:</h4>
|
||||||
<p>Static position is the default option for flex elements, meaning that they will be included in the flex flow, using flex properties.</p>
|
<p>Static position is the default option for flex elements, meaning that they will be included in the flex flow, using flex properties.</p>
|
||||||
<figure><img src="/img/flexible-layouts/flex-properties-element.webp" alt="Flex Layout properties" /></figure>
|
<figure><img src="/img/flexible-layouts/flex-properties-element.webp" alt="Flex Layout properties" /></figure>
|
||||||
<h4>Position absolute:</h4>
|
<h4>Absolute positioning:</h4>
|
||||||
<p>Selecting absolute position will exclude the element from the Flex layout flow allowing you to freely position an element in a specific place regardless of the size of the layout where it belongs.</p>
|
<p>Selecting absolute positioning will exclude the element from the Flex layout flow allowing you to freely position an element in a specific place regardless of the size of the layout where it belongs.</p>
|
||||||
<figure><img src="/img/flexible-layouts/flex-properties-element-absolute.webp" alt="Flex Layout properties" /></figure>
|
<figure><img src="/img/flexible-layouts/flex-properties-element-absolute.webp" alt="Flex Layout properties" /></figure>
|
||||||
<h4>Z-index:</h4>
|
<h4>Z-index:</h4>
|
||||||
<p>With the z-index option you can decide the order of overlapping elements while maintaining the layers order.</p>
|
<p>With the z-index option you can decide the order of overlapping elements while maintaining the layers order.</p>
|
||||||
|
|
|
@ -12,8 +12,8 @@ title: 03· Workspace basics
|
||||||
<img src="/img/workspace-basics/viewport.webp" alt="Penpot's viewport" />
|
<img src="/img/workspace-basics/viewport.webp" alt="Penpot's viewport" />
|
||||||
</a>
|
</a>
|
||||||
</figure>
|
</figure>
|
||||||
<h4>Navigate the viewport</h4>
|
<h4>Moving around the viewport</h4>
|
||||||
<p>Press <kbd>space</kbd> while moving your mouse to navigate the viewport. If you are using a trackpad you can do two finger scrolling.</p>
|
<p>Press <kbd>space</kbd> and drag to pan (move around the viewport). If you are using a trackpad you can do two finger scrolling.</p>
|
||||||
<p>You can also use the scrollbars, which are specially useful for those who love using graphic tablets.</p>
|
<p>You can also use the scrollbars, which are specially useful for those who love using graphic tablets.</p>
|
||||||
<figure>
|
<figure>
|
||||||
<video title="Navigating the viewport" muted="" playsinline="" controls="" width="100%" poster="/img/workspace-basics/viewport-navigate.webp" height="auto">
|
<video title="Navigating the viewport" muted="" playsinline="" controls="" width="100%" poster="/img/workspace-basics/viewport-navigate.webp" height="auto">
|
||||||
|
|
Loading…
Reference in New Issue
Block a user