What you have to do?
- at Other Graphical Elements -> Header, choose "Header is inside the main wrapper" at the first option and let Blog Title/Header Alignment to the left;
- Other Graphical Elements -> Navigation Bar Below Header choose "Navigation bar and its contents are aligned with your main page" at the second option and put Dropdown Menu Position to the left too;
- now go to Suffusion Options -> Backend -> Custom Includes -> Custom Styles and add this code:
- Code: Select all
/* next lines is just for round corners of navigation bar, you can skip it */
Probably you need to adjust the value of 750px to match with your header image (width of header + width of navigation bar need to not exceed the width of wrapper).
Also, if you wish to made this changes you need to go at Skinning -> Navigation Bar Below Header and decrease the size of fonts used here - with size that you have choosed your bar is already filled by items at full width.
- Go now to Skinning -> Header and increase/decrease the last value (Height of Header Image) until your menu came inline with the header image.
If you need to move your menu up, let's say at the middle of image, you can add between the curly brackets in the code above: margin-top:-50px; . Also, adjust that -50px to suit.