XAMLだとこんな感じで実現できます｡(これを実行したのが添付画像です)

<Window x:Class="TestWpfLayout.MainWindow"
 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
 Title="MainWindow" Height="350" Width="525">
 <DockPanel>
 <StackPanel Width="100">
 <Button Content="Button"/>
 <Button Content="Button"/>
 </StackPanel>
 <RichTextBox x:Name="richTextBox" MinWidth="300" DockPanel.Dock="Top">
 <FlowDocument PageWidth="{Binding ActualWidth, ElementName=richTextBox}">
 <Paragraph><Run Text="RichTextBox"/></Paragraph>
 </FlowDocument>
 </RichTextBox>
 </DockPanel>
</Window>

ﾀﾞｯｼｭﾎﾞｰﾄﾞの｢ﾃﾞｻﾞｲﾝ｣→｢ｶｽﾀﾏｲｽﾞ｣ﾀﾌﾞ内にある｢ﾃﾞｻﾞｲﾝCSS｣でCSSによるﾃﾞｻﾞｲﾝ変更が可能です｡
今回の場合は､以下の記述を追加してみてください｡

#container-inner {
 width: 100%;
}
#main {
 width: 100%;
}
.entry-header {
 width: 80%;
}

表示を確認しながら任意の数値を指定してみてください｡
特に｢.entry-header｣は記事ﾀｲﾄﾙ､ｶﾃｺﾞﾘｰ､日付等の表示部ですので､日付の表示位置に影響します｡


【※※ 追記 ※※】

訂正したｽﾀｲﾙを追記します｡

#container-inner {
 width: 100%;
}
#content-inner {
 position: relative;
}
#wrapper {
 float: none;
 margin-left: 250px;
}
#main {
 width: 100%;
}
#box2 {
 position: absolute;
 top: 0;
 left: 0;
}
.entry-header {
 width: 80%;
}

【※※ 追記 ※※】

右ｻｲﾄﾞﾊﾞｰに変更するｽﾀｲﾙです｡

#container {
 background: url('/css/theme/solid/box2_bg.png') repeat-y right;
}
#container-inner {
 width: 100%;
}
#content-inner {
 position: relative;
}
#blog-title, #wrapper {
 padding-left: 30px;
 padding-right: 25px;
 border-left: none;
}
#wrapper {
 float: none;
 margin-right: 255px;
}
#main {
 width: 100%;
}
#box2 {
 position: absolute;
 top: 0;
 right: 0;
}
.entry-header {
 width: 100%;
 padding-right: 0;
}
#footer {
 background: url('/css/theme/solid/box2_bg.png') repeat-y right;
}
#footer-inner {
 margin-left: 0;
 border-left: none;
}