Нееель, я просила сделать ширину в пикселях или емах)

Получилось, что дизайн у тебя так и остался резиновым, но при этом и тело контента стало уже, чем тело форума)
Тут все дело в относительности, в #pun ты задала ширину в 90%, эти 90% берутся от общей ширины страницы.
А вот ширина в 90% для .punbb - это уже 90% процентов ширины #pun, а не всей странички)
Подправь ширину для обоих селекторов)

Далее у нас идет выравнивание тела форума. Выравнивание задается только для #pun, если у тела нет рамки.
Выравнивание слева/справа делается в одну строчку:
float: left|right; - слева/справа соответственно
Запомни, этот параметр используется для выравнивания блочно-табличных элементов, но не для текста, для текста берется уже другой параметр.

Перед тем, как сделаешь выравнивание, открой дерево нашей странички (через просмотр кода), и найди там вот такую строку (справа вверху этого окошечка есть тоже строка поиска):

Кликнешь на неё - сразу подсветится тело форума целиком. Теперь ты наконец-то можешь обратиться к правому окошку. Справа у нас располагаются все свойства, прописанные для конкретного элемента. Первое, что ты там увидишь, это

Этой частью ты будешь пользоваться почти постоянно. Объясняю, почему. В стандартном стиле майббов некоторые элементы с одинаковыми свойствами прописаны через запятую: #селектор1, #селектор2, #селектор3 {параметр: аттрибут;}
Естественно, далеко не всегда тебе нужны будут у этих элементов одинаковые свойства.
А тот код, который в цитате выше - это код именно для этого селектора, без затрагивания остальных.
Сейчас ты кликаешь по пустому месту между фигурных скобочек, и там появляется маленькое окошечко для ввода. Начинаешь вводить слово float. Как только ты начнешь его набирать, в окошечке полупрозрачным появится это твое недописанное слово. Это на самом деле очень удобно, потому что ты не ошибешься в написании)
Как только дописала параметр, ставь ":" - тебя автоматически перебросит на ввод аттрибута. Там введи "right" - и сразу же у тебя форум встанет по правую сторону. НО! - у тебя еще не перенесены эти коды в сам стиль, поэтому открой новую вкладку с администрированием стиля и внеси в A5.1 прописанное в окошке справа и сохрани.
Пользоваться этим свойством Хрома очень легко и удобно, особенно если нужно что-то срочно поправить в коде. Например, ты случайно ввла ширину форума в 100 пикселей, и не можешь ни сохранить, ни что-то поменять - все настолько сплющено, что ты не видишь даже самого окна с кодами стиля. С помощью этого окошка ты увеличиваешь ширину форума, а потом исправляешь косяк) Все просто)
Сейчас ты ставишь форум с правой стороны + делаешь фиксированную ширину тела форума.

Умница) Теперь - что делать, если нам надо выровнять форум по центру?
Первое, что тебе нужно запомнить железно:
float: center; - это полная и безоговорочная ересь) Такого быть не может, а если вдруг встретится в каком-то коде - безжалостно удаляй, потому что ошибка)

А что же, собственно, значит "форум по центру (страницы)"? Вполне нетрудно догадаться, что "по центру" - это по середине, элемент находится на одинаковом расстоянии и от правого края страницы, и от левого.
И вот мы плавно подходим к следующему параметрам, которыми придется довольно часто оперировать)
margin и padding
Оба эти параметра отвечают за отступы, но все же есть весомое различие.
margin - отступ какого-либо блока от границ его родительского элемента, т.е. того элемента, в котором лежит искомый блок:

padding - отступ содержимого блока от его границ (самый частый пример использования - отступы для контента форума, чтобы тот не налезал на границы)

В данном случае ты рассуждаешь так: мы работаем с #pun, его надо поставить отступами по центру. Нам нужно поставить по центру сам блок, а не его "начинку", поэтому сразу видно, что нам нужен не padding, а margin.

Прописывать аттрибуты для отступов можно точно так же, как это мы делали для высоты и ширины, но с небольшой оговоркой - самих значений после параметра может быть от 1-го - до четырех.
1) margin: 10px; - сделает отступ от всех границ на 10 пикселей
2) margin: 0px auto; - уберет отступ сверху и снизу, а слева и справа сделает одинаковый отступ (как раз искомое выравнивание по центру)
3) margin: 50px auto 10px; - отступ сверху станет в 50 пикселей, сам форум по центру (отступы слева-справа равны), а отступ снизу - 10 пикселей
4) margin: 50% 10em 60px 20%; - аттрибуты смотрим в таком порядке: сверху справа снизу слева (т.е. по часовой стрелке сверху)

Сейчас ты ставишь форум по центру сначала через просмотр кода, а уже потом в самом стиле)

Теперь, когда у нас форум зафиксирован и стоит по центру, мы можем приступить к оооочень важной части)

Сейчас мы будем работать с фоном.
На самом деле используемых фона два, а не один, но работать с обоими мы будем работать и разбираться позже)

Сейчас нас интересует самый первый селектор во втором окне стиля

Это и есть наш фон. Для него мы можем задать несколько особо нужных нам параметров:
background-color: цвет | transparent; - собственно, заливает фон нужным нам цветом. Либо делает его прозрачным. Примечательно, что если ты будешь вводить через просмотр кода, то при непосредственно вводе цвета можно ввести туда не сам шестнадцатиричный код цвета, а набрать его словом, например red, cyan, goldenrod, gold, silver. Понажимай английскую раскладку, на многие из букв тебе будет раскрываться небольшой списочек всех доступных в словесном виде цветов. Причем ты в сам стиль можешь тоже вводить эти же названия - все будет работать. Так-то)
background-image: url(путь к файлу) | none; - задает для элемента фоновую картинку. Если на этой самой фоновой картинке есть прозрачные области, а в параметре выше мы не задали никакого цвета, то фон страницы будет белый, что, как ты понимаешь, иногда совсем "не в строчку". А если мы пропишем к параметру аттрибут none - то у нас картинки не будет вовсе.
background-attachment: fixed | scroll; - указывает на то, будет ли у нас фон статичным (сколько колесиком не крути - фон все время на месте стоит) или же прокручивающимся.
background-position: left/right/center bottom/top/center; - указывает на расположение фона на странице. У этого параметра два и только два аттрибута: расположение по горизонтали и по вертикали.
А теперь если конкретно, словами и в процентах, все возможные варианты:

Заметь, что при использовании процентного вида аттрибуда по порядку ВСЕГДА идет сначала горизонталь, потом вертикаль - и только так.
background-repeat: no-repeat | repeat | repeat-x | repeat-y; - определяет то, будет ли наш фон повторяться при наличии свободного места или нет. Расшифровываю аттрибуты в том порядке, в котором они написаны: фон не повторяется | фон повторяется во все стороны | фон повторяется только по горизонтали | фон повторяется только по вертикали.

Очень много прописывать для несчастного фона, да? НО, сейчас мы подходим к очень важному моменту - все эти пять строк ты можешь записать в одну:

То есть ты пишешь параметр background, а потом после двоеточия прописываешь все нужные тебе аттрибуты через пробел. И тебе необязательно прописывать вот прям все-все те, которые я дала выше. Нужны тебе только картинка и цвет - пожалуйста, пропиши эти два) Еще один плюс - ты можешь писать их в любом порядке, браузеры способны сами определить, что к чему относится)

Сейчас ты делаешь следующее - заливаешь фон каким-либо не очень рвущим глаз цветом, выбираешь любую виньетку отсюда: http://www.lenagold.ru/fon/clipart/v/vgor.html и уменьшаешь до приличных размеров. Ставишь картинкой на фон, причем фон должен находиться снизу по центру, прокручиваться и повторяться по горизонтали. Дерзай)

Скинь мне, плиз, под спойлер второе окно стиля