diff --git a/src/components/Attached.tsx b/src/components/Attached.tsx
new file mode 100644
index 0000000..d80172b
--- /dev/null
+++ b/src/components/Attached.tsx
@@ -0,0 +1,36 @@
+import { Type, SizeUnit, AttachType } from "../core-types";
+import * as React from "react";
+import { Space } from "./Space";
+import * as PropTypes from "prop-types";
+import { commonProps, IReactSpaceCommonProps } from "../core-react";
+
+interface IAttachedProps extends IReactSpaceCommonProps {
+	width?: SizeUnit;
+	height?: SizeUnit;
+	attachTo: string;
+	attachType: AttachType;
+}
+
+export const Attached: React.FC<IAttachedProps> = ({ width, height, attachTo, attachType, ...props }) => {
+	return (
+		<Space
+			{...props}
+			type={Type.Attached}
+			attachTo={attachTo}
+			attachType={attachType}
+			position={{
+				width: width,
+				height: height,
+			}}>
+			{props.children}
+		</Space>
+	);
+};
+
+Attached.propTypes = {
+	...commonProps,
+	...{
+		width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+		height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	},
+};
diff --git a/src/components/index.tsx b/src/components/index.tsx
index 90244ac..65b5123 100644
--- a/src/components/index.tsx
+++ b/src/components/index.tsx
@@ -8,6 +8,7 @@ export * from "./Fill";
 export * from "./Fixed";
 export * from "./Layer";
 export * from "./Positioned";
+export * from "./Attached";
 export * from "./SpaceInfo";
 export * from "./ViewPort";
 export * from "./SSR";
diff --git a/src/components/stories/02-components/Attached.stories.mdx b/src/components/stories/02-components/Attached.stories.mdx
new file mode 100644
index 0000000..6b9e5c6
--- /dev/null
+++ b/src/components/stories/02-components/Attached.stories.mdx
@@ -0,0 +1,37 @@
+import { Meta, Story, Canvas, Props } from "@storybook/addon-docs";
+import { withKnobs } from "@storybook/addon-knobs";
+import { ViewPort, LeftResizable, Attached, AttachType } from "../../../";
+import { green, description, lorem } from "../Utils";
+import { CommonHeader, PropsTable, StandardProps, AnchoredProps } from "../Utils";
+
+<CommonHeader />
+
+<Meta title="Components/Attached" component={Attached} />
+
+## Bottom
+
+Anchored space on the bottom edge of it's parent.
+
+### Specifying a % size
+
+<Canvas>
+	<Story name="Default (%)">
+		<ViewPort>
+			<LeftResizable id="left" style={green} size="25%">
+				{description("Bottom 50%")}
+			</LeftResizable>
+			<Attached attachTo="left" width={100} height={100} style={{ backgroundColor: 'maroon', color: 'white' }}>
+				{description("Attached")}
+			</Attached>
+		</ViewPort>
+	</Story>
+</Canvas>
+
+### Properties
+
+<Story name="Properties">
+	<PropsTable>
+		<AnchoredProps />
+		<StandardProps />
+	</PropsTable>
+</Story>
\ No newline at end of file
diff --git a/src/core-types.ts b/src/core-types.ts
index a9b3d68..0d3f1e6 100644
--- a/src/core-types.ts
+++ b/src/core-types.ts
@@ -10,6 +10,7 @@ export enum Type {
 	Fill = "fill",
 	Positioned = "positioned",
 	Anchored = "anchored",
+	Attached = "attached",
 	Custom = "custom",
 }
 
@@ -20,6 +21,13 @@ export enum AnchorType {
 	Bottom = "anchor-bottom",
 }
 
+export enum AttachType {
+	Left = "left",
+	Right = "right",
+	Top = "top",
+	Bottom = "bottom",
+}
+
 export enum Orientation {
 	Horizontal,
 	Vertical,
@@ -76,6 +84,8 @@ export interface ISpaceProps extends ICommonProps {
 	anchor?: AnchorType | undefined;
 	order?: number | undefined;
 	position?: IPositionalProps | undefined;
+	attachTo?: string;
+	attachType?: AttachType | undefined;
 	handleSize?: number | undefined;
 	handlePlacement?: ResizeHandlePlacement;
 	touchHandleSize?: number | undefined;
@@ -172,6 +182,8 @@ export interface ISpaceDefinition {
 	canResizeBottomRight: boolean;
 	allowOverflow: boolean;
 	ssrStyle: string;
+	attachTo: string | undefined;
+	attachType: AttachType | undefined;
 }
 
 export interface ISpaceContext {
diff --git a/src/core.ts b/src/core.ts
index 56f02c5..7af91c0 100644
--- a/src/core.ts
+++ b/src/core.ts
@@ -231,6 +231,8 @@ export function createStore(): ISpaceStore {
 				touchHandleSize,
 				handlePlacement,
 				allowOverflow,
+				attachTo,
+				attachType,
 			} = props;
 			const canResizeLeft = (position && position.leftResizable) || false;
 			const canResizeRight = (position && position.rightResizable) || false;
@@ -399,6 +401,14 @@ export function createStore(): ISpaceStore {
 				changed = true;
 			}
 
+			if (space.attachTo !== attachTo) {
+				space.attachTo = attachTo || spaceDefaults.attachTo;
+			}
+
+			if (space.attachType !== attachType) {
+				space.attachType = attachType || spaceDefaults.attachType;
+			}
+
 			if (changed) {
 				if (space.parentId) {
 					const parentSpace = getSpace(space.parentId);
diff --git a/src/index.ts b/src/index.ts
index 2341f7d..30e828c 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -10,7 +10,7 @@ import type {
 	ResizeTouchEvent
 } from "./core-types";
 
-export { ResizeHandlePlacement, ResizeType, AnchorType, CenterType, Type } from "./core-types";
+export { ResizeHandlePlacement, ResizeType, AnchorType, CenterType, Type, SizeUnit } from "./core-types";
 
 export type {
 	ISpaceContext,