przyklejanie się diva do lewej strony

Witam
Przy robieniu swojej strony internetowej napotkałem na problem.
W cssie cała strona ma szerokość 100%

#content
{
	width:1000px;
	margin-left:auto;
	margin-right:auto;
	text-align:justify;
}
#menu
{
	background-color:white;
	color:black;
	float:left;
	padding:20px;
	width:280;
	text-align:justify;
	min-height:620px;
}

chciałbym, żeby content był na środku a menu lekko odsunięte po prawej stronie, jednak nie wiem jak to zrobić. Próbowałem zrobić aby wstawić niewidzialny prostokąt po lewej stronie aby zablokować na środku tekst, ale to mija się z celem, ponieważ przy pomniejszaniu okna tekst zostaje, bez skalowania.
Z góry dzięki za pomoc :D

Narysuj, jak to widzisz, pokaż kod html.

Freja Draco napisał(a):

Narysuj, jak to widzisz, pokaż kod html.
https://imgur.com/a/v3M7jyw tutaj taki szybki szkic, jak to ma wyglądać.

 <div id="content">
			<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Massa vitae tortor condimentum lacinia quis vel eros 
                        donec. Convallis posuere morbi leo urna molestie at elementum. Varius sit amet mattis vulputate enim. Aliquam ut porttitor leo a diam. Urna condimentum mattis pellentesque id nibh 
                        tortor id aliquet lectus. Cursus sit amet dictum sit amet justo donec enim diam. Diam in arcu cursus euismod quis viverra nibh cras pulvinar. Ac turpis egestas sed tempus urna et. 
                        Neque aliquam vestibulum morbi blandit cursus risus. Lorem ipsum dolor sit amet consectetur adipiscing. Tortor at risus viverra adipiscing. Ac odio tempor orci dapibus ultrices in 
                        iaculis nunc sed. Lectus vestibulum mattis ullamcorper velit sed ullamcorper morbi.</p>
		</div>
		<div id="menu">
                       Tutaj będzie menu
		</div>

ps. jakbyś był gotowy wejść w 2019, to polecam: https://www.w3schools.com/css/css3_flexbox.asp

display:flex wydaje się najsensowniejszym wyjściem, bo daje największe możliwości skonfigurowania sobie tego, ale to trochę upiedliwe jest:
http://drakonica.pl/dokumenty/flexbox_zestawienie.htm

Możesz jeszcze pokombinować z display:table / display:table-cell
albo po prostu float:right dla menu.

Muszę właśnie coś innego zrobić, a kompletnie mi się nie chce, więc nie rozpiszę w szczegółach, ale ktoś ci pewnie pomoże.

Nie wiem dlaczego ludzie boją się css grida, przecież to największe osiągnięcie ludzkości od czasów wynalezienia lizaków kogucików.
A wsparcie podobne jak flex - czytaj: nie działa w IE (tak wiem, flex troche działa w IE11 ale jest zbugowany).

HTML

<header class="header"></header>
<nav class="nav"></nav>
<main class="main"></main>

CSS

body {
  display: grid;
  grid-template-columns: 10px 1fr 4fr 1fr 10px;
  grid-template-rows: 200px 1fr;
  column-gap: 20px;
  min-height: 100vh;
}

.header {
  grid-row: 1 / 2;
  grid-column: 1 / 6;
  background-color: red;
}

.nav {
  grid-column: 4 / 5;
  grid-row: 2 / 3;
  background-color: blue;
}
.main {
  grid-column: 3 / 4;
  grid-row: 2 / 3;
  background-color: green;
}

live demo

A tutaj dobry tutorial do css grid