Welcome Guest [Log In] [Register]
We hope you enjoy your visit.

You're currently viewing our forum as a guest. This means you are limited to certain areas of the board and there are some features you can't use. If you join our community, you'll be able to access member-only sections, and use many member-only features such as customizing your profile, sending personal messages, and voting in polls. Registration is simple, fast, and completely free.


Join our community!


If you're already a member please log in to your account to access all of our features:

Username:   Password:
Add Reply
Width; I changed the topic since after 24 hrs I finally worked it out MYSELF
Topic Started: Jul 4 2009, 07:25 AM (853 Views)
abro
Member
 *  
BOARD URL: http://z3.invisionfree.com/melbournewf/index.php

I've merged my submenu and userlink thing together. Now I need them the width of the entire page but the same height to modify my board a bit. How do I do this?
Edited by abro, Jul 5 2009, 07:45 AM.
Offline Profile Quote Post Goto Top
 
abro
Member
 *  
That's odd? 24 Hours and not a single reply... BUMP! The time at the bottom says 6:26am and I originally posted this at 6:25am the night before.
Offline Profile Quote Post Goto Top
 
Pete B
Member
 *   *   *   *   *   *   *   *  
Hi,

Well, your entire forum has a margin set around it. If you remove it you'll force the combined submenu to cover the width of the entire page, but everything else will expand.

To do this, replace the BODY part of your css with this:
Code:
 
BODY { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #000; margin:10px 0; background-color:#FFFFFF }
Offline Profile Quote Post Goto Top
 
abro
Member
 *  
Sorry but it also changes the width of the forums and maintitles and info centers. I only need the submenu the same size as the screen. Also, my modified submenu has both the userlinks and submenu things. I installed a code for that but currently, some of the text is cutting off the screen, how do I place it back on the bar?
Offline Profile Quote Post Goto Top
 
Pete B
Member
 *   *   *   *   *   *   *   *  
Hey,

Firstly, I've wrapped the contents of your forum below the submenu in a div (#main_content) with a percentage width set on it. I added the relevent code at the end of your CSS. You can increase or decrease the percentage value to make that part of your forum wider or narrower. There is also a percentage width set on the #logostrip which holds your forum's banner which can be editted in a similar fashion to the #main_content.

Regarding the background image of the submenu, the image in the css is too small in height to cover the now taller submenu. So what I've done is set the image to appear at the top and filled the bottom gap in with a solid colour (which is a continuation of the bottom colour of the gradient image).

So here's the code:
CSS
Code:
 
html { overflow-x: auto; }
form { display:inline; }
img { vertical-align:middle; border:0px }
BODY { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #000; margin:10px 0px;background-color:#FFFFFF }
TABLE, TR, TD { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #000; }
a:link, a:visited, a:active { text-decoration: none; color: #6F5D5D }
a:hover { color: #4B3F3F; text-decoration:none }

fieldset.search { padding:6px; line-height:150% }
label { cursor:pointer; }

img.attach { border:2px outset #EEF2F7;padding:2px }

.googleroot { padding:6px; line-height:130% }
.googlechild { padding:6px; margin-left:30px; line-height:130% }
.googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { font-size:11px; color: #3A4F6C; }
.googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:14px; font-weight:bold; color:#00D; }
.googlepagelinks { font-size:1.1em; letter-spacing:1px }
.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:10px; color:#434951 }

li.helprow { padding:0px; margin:0px 0px 10px 0px }
ul#help { padding:0px 0px 0px 15px }

option.cat { font-weight:bold; }
option.sub { font-weight:bold;color:#555 }
.caldate { text-align:right;font-weight:bold;font-size:11px;color:#777;background-color:#DFE6EF;padding:4px;margin:0px }

.warngood { color:green }
.warnbad { color:red }

#padandcenter { margin-left:auto;margin-right:auto;text-align:center;padding:14px 0px 14px 0px }

#profilename { font-size:28px; font-weight:bold; }
#calendarname { font-size:22px; font-weight:bold; }

#photowrap { padding:6px; }
#phototitle { font-size:24px; border-bottom:1px solid black }
#photoimg { text-align:center; margin-top:15px }

#ucpmenu { line-height:150%;width:22%; border:1px solid #345487;background-color: #F5F9FD }
#ucpmenu p { padding:2px 5px 6px 9px;margin:0px; }
#ucpcontent { background-color: #F5F9FD; border:1px solid #345487;line-height:150%; width:auto }
#ucpcontent p { padding:10px;margin:0px; }

#ipsbanner { position:absolute;top:1px;right:5%; }
#logostrip { border:1px solid #ffffff;background-color: #FFFFFF; padding:0px;margin:0px auto;width:90%;text-align:center; }

#submenu { background: url(http://img37.imageshack.us/img37/6284/51324994.png) top repeat-x #A5A5A5;font-size:10px;margin:3px 0px 3px 0px;color:#3A4F6C;font-weight:bold;}
#submenu a:link, #submenu a:visited, #submenu a:active { font-weight:bold;font-size:10px;text-decoration: none; color: #6F5D5D; }

#userlinks { border:1px solid #BFBFBF; background-image: url(http://img37.imageshack.us/img37/6284/51324994.png) }

#navstrip { font-weight:bold;padding:6px 0px 6px 0px; }

.activeuserstrip { background-color:#BCD0ED; padding:6px }

.pformstrip { background-color: #FFFFFF ; color:#000000;font-weight:bold;padding:7px;margin-top:1px }
.pformleft { background-color: #F5F9FD; padding:6px; margin-top:1px;width:25%; border-top:1px solid #C2CFDF; border-right:1px solid #C2CFDF; }
.pformleftw { background-color: #F5F9FD; padding:6px; margin-top:1px;width:40%; border-top:1px solid #C2CFDF; border-right:1px solid #C2CFDF; }
.pformright { background-color: #F5F9FD; padding:6px; margin-top:1px;border-top:1px solid #C2CFDF; }

.post1 { background-color: #F5F9FD }
.post2 { background-color: #EEF2F7 }
.postlinksbar { background-color:#D1DCEB;padding:7px;margin-top:1px;font-size:10px; background-image: url(http://i1.ifrm.com/style_images/1/tile_sub.gif) }

.row1 { background-color: #FFFFFF }
.row2 { background-color: #FFFFFF }
.row3 { background-color: #FFFFFF }
.row4 { background-color: #FFFFFF }

.darkrow1 { background-image: url(http://img156.imageshack.us/img156/2540/34351998.png); color:#FFFFFF; }
.darkrow2 { background-color: #FFFFFF; color:#3A4F6C; }
.darkrow3 { background-color: #D1DCEB; color:#3A4F6C; }

.hlight { background-color: #DFE6EF }
.dlight { background-color: #EEF2F7 }

.titlemedium { font-weight:bold; color:#000000; padding:7px; margin:0px; background-COLOR: #FFFFFF }
.titlemedium a:link, .titlemedium a:visited, .titlemedium a:active { text-decoration: underline; color: #3A4F6C }

.maintitle { background-image: url(http://img16.imageshack.us/img16/7940/75566502.png); vertical-align:middle;font-weight:bold; color:#FFFFFF; letter-spacing:1px; padding:8px 0px 8px 5px; }
.maintitle a:link, .maintitle a:visited, .maintitle a:active { text-decoration: none; color: #FFFFFF }
.maintitle a:hover { text-decoration: none }

.plainborder { border:1px solid #BFBFBF;background-color:#BFBFBF }
.tableborder { border:1px solid #AAAAAA; }
.tablefill { border:1px solid #BFBFBF;background-color:#BFBFBF;padding:6px; }
.tablepad { background-color:#BFBFBF;padding:6px }
.tablebasic { width:100%; padding:0px 0px 0px 0px; margin:0px; border:0px }

.wrapmini { float:left;line-height:1.5em;width:25% }
.pagelinks { float:left;line-height:1.2em;width:35% }

.desc { font-size:10px; color:#434951 }
.edit { font-size: 9px }

.signature { font-size: 10px; color: #339 }
.postdetails { font-size: 10px }
.postcolor { font-size: 12px; line-height: 160% }

.normalname { font-size: 12px; font-weight: bold; color: #003 }
.normalname a:link, .normalname a:visited, .normalname a:active { font-size: 12px }
.unreg { font-size: 11px; font-weight: bold; color: #900 }

.searchlite { font-weight:bold; color:#F00; background-color:#FF0 }

#QUOTE { font-family: Verdana, Arial; font-size: 11px; color: #465584; background-color: #FAFCFE; border: 1px solid #000; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }
#CODE { font-family: Courier, Courier New, Verdana, Arial; font-size: 11px; color: #465584; background-color: #FAFCFE; border: 1px solid #000; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }

.copyright { font-family: Verdana, Tahoma, Arial, Sans-Serif; font-size: 9px; line-height: 12px }

.codebuttons { font-size: 10px; font-family: verdana, helvetica, sans-serif; vertical-align: middle }
.forminput, .textinput, .radiobutton, .checkbox { font-size: 11px; font-family: verdana, helvetica, sans-serif; vertical-align: middle }

.thin { padding:6px 0px 6px 0px;line-height:140%;margin:2px 0px 2px 0px;border-top:1px solid #FFF;border-bottom:1px solid #FFF }

.purple { color:purple;font-weight:bold }
.red { color:red;font-weight:bold }
.green { color:green;font-weight:bold }
.blue { color:blue;font-weight:bold }
.orange { color:#F90;font-weight:bold }

#main_content {
width:90%;
margin:0px auto;
}


Header & Body
Code:
 
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink="#000000" vlink="#000000">
<% BOARD HEADER %>
<div id="main_content">
<% NAVIGATION %>
<% BOARD %>
</div>


Footer
Code:
 
<script>
// Merge User/Main Menu - Leave Copyright Intact Wherever Used
// Created For Invision Free
// Author: Zero Tolerance © Game Zone | Evolution 2004 [http://gzevolution.net]

UserMenuA = document.getElementById('userlinks').getElementsByTagName('td')[0].innerHTML
UserMenuB = document.getElementById('userlinks').getElementsByTagName('td')[1].innerHTML

Row = document.getElementById('submenu').insertRow(-1)
Cell = Row.insertCell(-1)
Cell.innerHTML = UserMenuA
CellB = Row.insertCell(-1)
CellB.innerHTML = UserMenuB
CellB.align = 'right'

document.getElementById('userlinks').parentNode.removeChild(document.getElementById('userlinks'))
</script>

Offline Profile Quote Post Goto Top
 
abro
Member
 *  
Two problems...

A) The below forums and info center aren't centered anymore.

B) The two bars are no longer merged.

I've removed the codes and replaced them with my own. Please change the codes again to go with these settings.
Offline Profile Quote Post Goto Top
 
Pete B
Member
 *   *   *   *   *   *   *   *  
Ah, I overlooked something with IE.

Navigate to your board wrappers and in the top input box titled Document Type, paste in this:

Code:
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


The submenu appears to be merged on my test board, http://z9.invisionfree.com/bartiforumstest, had you applied the code to the footers?

Pete
Offline Profile Quote Post Goto Top
 
abro
Member
 *  
Thanks, that's exactly how I wanted it. I modified it so the banner would be at the left... is that alright? Or do I have to put another copyright or should I have a permission slip or something? O_o
Offline Profile Quote Post Goto Top
 
Pete B
Member
 *   *   *   *   *   *   *   *  
Thats fine.
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · zIFBoards - Skinning & Code Support · Next Topic »
Add Reply