Text Footer menu

A place for discussion about skinning and design. Before posting questions here you should review the documentation about creating skins.

This thread is closed to new posts. You must sign in to post in the forums.
2/8/2012 6:05:17 PM
Gravatar
Total Posts 383
Thanks Squire Dude

Re: Text Footer menu

Hi Joe D.

I did include the code you sent in the style-srtisteer-overrides.css... here is the complete files code (including the last changes)...

/* overrides for Artisteer you should not modify the files exported from Artisteer such as style.css, you can override things as needed here or in stylemojo.css */

/* this is needed because the artisteer buttons otherwise looke enabled even when disable */
input.art-button[disabled="disabled"] { background-color: #ccccff !important; color: #9999cc !important; }

/* this keeps the background images out of the editor and dialog pages */
body.dialogpage ,
body.filedialog,
body.wysiwygeditor
{
background-color: white;
color:black;
background-image: none;
font-size: 12px;
min-width: 100px;
}

body.help-page
{
color:black;
background-color: white;
background-image: none;

}

body.wysiwygeditor  p
{
font-size: 14px;
margin: 12px 0;

}

body.wysiwygeditor ul li
{
text-decoration: none;
line-height: 125%;
padding: 0 0 0 13px;
margin-left:20px;
background-image: url('images/blockcontentbullets.png');
background-repeat: no-repeat;
}

body.wysiwygeditor  h1 { font-size:28px; }
body.wysiwygeditor  h2 {font-size :24px;}
body.wysiwygeditor  h3 { font-size: 22px; }
body.wysiwygeditor  h4 { font-size: 18px; }
body.wysiwygeditor  h5 { font-size: 16px; }

body { overflow-x:hidden;  }
form { height:100%; }

img
{
border: 0!important;
}

ul.userstats img,
ul.linkitem  img{ margin:0; }

/* this keeps side bar background images from pushing past the footer in some designs */
.leftside , .rightside{ overflow: hidden;}

.art-blockheader .t {max-height:40px; overflow:hidden; }

input, select, textarea { text-transform:none; }

.folder-panel, div.file-wraper { background-color:white; }
ul.file-list,
ul.file-list li ,
ul.folder-list,
ul.folder-list li
{ background-image:none; color:black; }

.aspcalendarmain th, .aspcalendarmain td,
.mpcalendarmain th, .mpcalendarmain td { text-align:center; }

.eventweekview  table,
.eventdayview  table { color:black; width:100%; }

.AspNet-DataList table td,
.eventdayview  table th,
.eventdayview  table td,
.eventweekview  table th,
.eventweekview  table td
{padding: 0px; border:none; }

table.FileManager_table {  border-spacing: 0px; }

.permission td,
.permission th,
.formwizard th,
.formwizard td ,
.sharedfiles th,  .sharedfiles td , .filemanager th , .filemanager td{ border:none; padding: 3px 0px 3px 0px!important;}
.filemanager th img, .filemanager td img, .sharedfiles th img, .sharedfiles td  img { margin:0px 2px 0px 2px ; }

/* begin Header */
div.art-header
{
margin: 0 auto;
position: relative;
z-index: -5;
width:900px;
height: 303px;
margin-top: 0;
margin-bottom: -3px;
}
.art-header-position
{
position: absolute;
top: 0;
right: 0;
left: 0;
}

.art-header-wrapper
{
position: relative;
top:0;
width:900px;
margin:0 auto;
}
.art-header-inner
{
position: relative;
margin: 0 3px;
}

.art-header:before
{
position: absolute;
display:block;
content:' ';
z-index:-2;
top: 0;
width:100%;
height: 303px;
background-image: url('images/header.png');
background-repeat: no-repeat;
background-position:top center;
}

.art-header:after
{
position: absolute;
z-index:-1;
display:block;
content:' ';
top: 0;
left:11px;
right:11px;
height: 303px;
background-image: url('images/header.jpg');
background-repeat: no-repeat;
background-position: center center;
}
/* end Header */

/* FOOTER NAV */
.footernav {
text-align: center;
display: block;
}
.footernav li {
display: inline;
padding: 0 5px;
}

.footernav li:first-child {
padding-left: 0;
background: none;
}

/* To hide a link from the Site Menu, place the footeronly class in the
* "Custom Menu CSS Class" option in the page settings for a particular page.
*/
.sf-menu > li.footeronly {
display: none;
}

The footer menu is now showing up left-aligned and I am unable to locate the place to change it!  There is also no separator (>>>) between the menu items.

Got any suggestions?

Thanks
Phill

2/8/2012 6:25:30 PM
Gravatar
Total Posts 2253

Re: Text Footer menu

Hi Phill,

I think you having caching enabled in the user.config/web.config because I am not seeing the css show up in firebug at all. Considering you're running 2.3.8.1, you can just go to Administration > Advanced Tools > Design Tools > Cache Tool and then click on the "Reset Skin Version Guid" button. This will force all browsers to download the entire skin again.

I removed the css for the separator because I use an image for the separator couldn't attach that to the forum. For a separator, add this to your css: 

.footernav li { border-right: 1px solid #000; }
.footernav li:last-child { border-right: 0 none; }

HTH,
Joe D. 

2/9/2012 10:32:51 AM
Gravatar
Total Posts 383
Thanks Squire Dude

Re: Text Footer menu

Hi Joe D,

Thanks for the help.

Okay so I have turned OFF the Caching for now, I added the lines you noted to get the separator bar, and I Reset the Skin Version GUID, Reloaded and... Got the Bars BUT it is still left aligned?

So with the bars showing up I know that the CSS file is getting loading now.  I also notice that there is no Bar between the Home and 1st menu item.

So why is it still left aligned?

Thanks

2/9/2012 10:51:41 AM
Gravatar
Total Posts 1203
Proud member of the mojoPortal team

Help support mojoPortal!
Add-on modules

Re: Text Footer menu

Hi Phill, try this. I used Firebug to inspect the CSS for .art-footer-text (since that's the block you're trying to emulate), and used trial and error to come up with this subset that should make the bottom menu look the way you want.

.footernav {
   left: 50%;
   padding-left: 42px;
   padding-right: 42px;
   position: relative;
   text-align: center;
}

2/9/2012 11:01:41 AM
Gravatar
Total Posts 383
Thanks Squire Dude

Re: Text Footer menu

Hi Joe D,

That got it... looks great... I am sorry that I am so bad at CSS... thank goodness for people like yourself.

Thanks
Phill

2/9/2012 11:29:40 AM
Gravatar
Total Posts 2253

Re: Text Footer menu

Hi Phill,

That was Jamie that told you how to center it.

The first element (home) doesn't have the border on the right because you copied the border-right: 0 none; rule to the wrong selector. You should have the border-right: 0 none; in a new selector labeled .footernav li:last-child. Or, you could change the border-right: 1px solid #000; in the .footernav li to border-left and the border-right in .footernav li:first-child to border-left.

HTH,
Joe D. 

2/9/2012 4:09:16 PM
Gravatar
Total Posts 383
Thanks Squire Dude

Re: Text Footer menu

Hi Guys,

Jamie I appologise for the error.. my mistake... thanks for the code.

Joe D.  Thanks for the correction... of course when I did as you said it all worked correctly including the bar after the Home menu item.

Thanks to all of you very much.  Life would be a terrible place with out people like yourselves.

Thanks
Phill

You must sign in to post in the forums. This thread is closed to new posts.