HTML Editing xhtml / css of booksonline template

Hello,

I have been trying to edit the bookonline template so that the menu and nav bar is on the right of the screen and the rest of the page is to the left (I want all links are on the right).

I added float:right to #menu and altered .nav to float:right.

It does not appear to be working as I expected. I am thinking I have to alter the xhtml somehow but I don't know what to do. Any help please.

 

Changing the floats won't do much. You will need to add and change margins of the various sections too.

For example for the header div you need to change the
left: 128px;
to
left: 0;

then on the menu div to add the margin to move it to the right
margin-left: 502px;

For the main page content is more complicated because the left column and main page sections are grouped and split into different ones. So you have orangerow and greenrow that include the left links and main content like different rows. Navigation elements should be in an independent section.

My opinion is to create a new stylesheet and the HTML from scratch, it will take less time and you will be able to use it. As it is now if for instance you add more text inside the orangerow section the content will expand and the orange nav will show margin relative to the extra text height in the main section.

If you're concerned with the bottom section that won't be aligned use negative margins (side column and main section) to cap it.

 

Thanks heaps enigma1. You helped me a lot. I will continue creating from scratch.

 

Here is a couple of web template generators
-
hope this helps
falcon

Free CSS Template Code Generator - Maker for 3 Column Layout ...
Free CSS Template Code Generator - Maker for 3 Column Layout (tableless)

Online Css Layout Generator
Online Css Layout Generator | WebStockBox