Simple Machines Community Forum

Customizing SMF => Graphics and Templates => Topic started by: mulwa on April 18, 2014, 11:56:00 AM

Title: please how can i make the top section to be wider that the other section?
Post by: mulwa on April 18, 2014, 11:56:00 AM
please masters, how can i make the top section (including nav menu) to be at 100% wide and the board to be 90% wide? And how can i separate the nav menu with vertical bar ("|")?
Thank you for your help and time
Title: Re: please how can i make the top section to be wider that the other section?
Post by: Sir Osis of Liver on April 18, 2014, 02:19:28 PM
Which theme are you using?
Title: Re: please how can i make the top section to be wider that the other section?
Post by: mulwa on April 18, 2014, 03:36:20 PM
this is the link to the theme (on the beach). http://custom.simplemachines.org/themes/index.php?lemma=2753, the author of the theme couldn't help me to do it,
Title: Re: please how can i make the top section to be wider that the other section?
Post by: Sir Osis of Liver on April 19, 2014, 01:26:03 AM
Ok, mope, here's what to do:

To set header, main menu, and footer width to 100%, go to Admin -> Current Theme -> Forum Width.

To reduce board index width to 90% (or whatever you like) and center it, in /css/index.css do this -



#main_content_section
{
width: 90%;
margin: auto;
min-height: 200px;
}



To add a vertical line between buttons, in /css/index.css do this -



.dropmenu a
{
display: block;
padding: 9px 12px 9px 12px;
color: #000;
text-decoration: none;
border-right: 1px black solid;
}
.dropmenu a span
{
display: block;
padding: 0 0 0 5px;
font-size: 0.9em;
}
/* the background's first level only */
.dropmenu li a.firstlevel
{
margin-right: 0px;
}



Too tired to figure out how to either add a vertical border before the first button, or remove the border after the last button, but maybe someone in an earlier timezone can jump in and do it.

Back up the file before you tinker with it.

  (https://www.simplemachines.org/community/proxy.php?request=http%3A%2F%2Fwww.thekrashsite.com%2Fpics%2Fbor.gif&hash=cba0817857a10dc1cd975d2b49a33ba2fc822800)