The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Banners on forum need to be side by side

Page 1 of 2 1, 2  Next

View previous topic View next topic Go down

Banners on forum need to be side by side

Post by Bangernomics on January 28th 2013, 3:09 pm

I found this code on here but can anyone tell me how I would be able to add more than one banner side by side, I have tried it with this code but I get them on top of each other which I don't want.

Administration Panel --> Display --> Homepage --> Generalities --> Homepage message --> Message content :, add this code below.

Code:
<center><a href="Insert Link Here"><img src="http://mbmfiles.com/Dec2012/121220-TeWyLYZFMifm.jpg"></img></a></center>

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Cassius Dio on January 28th 2013, 5:21 pm

Hi,

Add to JavaScript codes management:
Code:
$(document).ready(function(){
$('#logostrip').after('
<div id="logostrip" class="clearfix">
<a href="/forum" id="logo">
<img src="HERE-YOUR-LOGO-URL">
</a>
</div>
');
});
Replace HERE-YOUR-LOGO-URL by your image logo link. Wink

Cassius Dio
Forumember

Male Posts : 581
Reputation : 79
Language : Romanian &English
Location : Yellow Submarine

http://beatles.forummo.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 28th 2013, 5:23 pm

Where do I find: Add to JavaScript codes management:

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Calιbuяn on January 28th 2013, 5:24 pm

Admin Panel > Modules > Javascript codes management

Calιbuяn
Forumember

Male Posts : 386
Reputation : 38
Language : English
Location : Detroit, MI

http://lazarusexp.forumotion.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 28th 2013, 8:07 pm

Thank you I have found it. Can you tell me how I could make this into a crackable banner that goes to an external site? in a new tab or window.

Thank you

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 28th 2013, 10:07 pm

SGSS wrote:Hi,

Add to JavaScript codes management:
Code:
$(document).ready(function(){
$('#logostrip').after('
<div id="logostrip" class="clearfix">
<a href="/forum" id="logo">
<img src="HERE-YOUR-LOGO-URL">
</a>
</div>
');
});
Replace HERE-YOUR-LOGO-URL by your image logo link. Wink


This doesn't work it still puts the banner in the middle and I all so get a lot of the code showing and the banner.

Just to remind you this is what I asked...

Can you tell me how I could make this into a crackable banner that goes to an external site? in a new tab or window. I need the banner to go below the nav bar and to the left so I can add others at a later date if I want. I've explained it a little different so I hope its clear now?

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by FIB on January 28th 2013, 11:48 pm

I'd like to know how this is done to.

FIB
Forumember

Male Posts : 490
Reputation : 2
Language : English
Location : UK

http://ourbulgariaforum.freeforums.eu/

Back to top Go down

Re: Banners on forum need to be side by side

Post by SLGray on January 29th 2013, 1:56 am

@Bangernomics wrote:Thank you I have found it. Can you tell me how I could make this into a crackable banner that goes to an external site? in a new tab or window.

Thank you

@Bangernomics wrote:
SGSS wrote:Hi,

Add to JavaScript codes management:
Code:
$(document).ready(function(){
$('#logostrip').after('
<div id="logostrip" class="clearfix">
<a href="/forum" id="logo">
<img src="HERE-YOUR-LOGO-URL">
</a>
</div>
');
});
Replace HERE-YOUR-LOGO-URL by your image logo link. Wink


This doesn't work it still puts the banner in the middle and I all so get a lot of the code showing and the banner.

Just to remind you this is what I asked...

Can you tell me how I could make this into a crackable banner that goes to an external site? in a new tab or window. I need the banner to go below the nav bar and to the left so I can add others at a later date if I want. I've explained it a little different so I hope its clear now?
Please don't double/triple post. Your post need to be separated by 24 hours before bumping, replying or adding more information. Please use the edit button instead!

First Reminder


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36681
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 29th 2013, 2:06 am

Ok sorry I didn't realise, I thought it was ok to reply. Embarassed

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 29th 2013, 2:14 am


Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 29th 2013, 2:32 pm

I've added the code in the style sheet as you can see but I'm getting a message as below.

Code:
body {
   background-color: #3c8fb4;
   background-image: url("http://i31.servimg.com/u/f31/12/11/05/42/sans-t11.png");
   background-attachment: scroll;
        background-repeat: repeat-x;
   scrollbar-face-color: #dee3e7;
   scrollbar-highlight-color: #000000;
   scrollbar-shadow-color: #dee3e7;
   scrollbar-3dlight-color: #d1d7dc;
   scrollbar-arrow-color: #006699;
   scrollbar-track-color: #efefef;
  scrollbar-darkshadow-color: #98aab1;
        }
#i_logo, #secondLogo {
width: 95%;
}


Detected error
We have counted a different number of "{" and of "}". It means your CSS risks to be not valid and will not be posted correctly on your forum.

We advise you to reread your code.

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Calιbuяn on January 29th 2013, 2:37 pm

Can you provide us with your entire CSS with that in it? Just so we can check everything. thumright

Calιbuяn
Forumember

Male Posts : 386
Reputation : 38
Language : English
Location : Detroit, MI

http://lazarusexp.forumotion.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 29th 2013, 2:49 pm

Here it is

Code:
body {
   background-color: #3c8fb4;
   background-image: url("http://i31.servimg.com/u/f31/12/11/05/42/sans-t11.png");
   background-attachment: scroll;
        background-repeat: repeat-x;
   scrollbar-face-color: #dee3e7;
   scrollbar-highlight-color: #000000;
   scrollbar-shadow-color: #dee3e7;
   scrollbar-3dlight-color: #d1d7dc;
   scrollbar-arrow-color: #006699;
   scrollbar-track-color: #efefef;
  scrollbar-darkshadow-color: #98aab1;
        }
#i_logo, #secondLogo {
width: 95%;
}

th,td,p {
    font-family: Verdana,Arial,Helvetica,sans-serif }
a img {
    border: none;
    }
a:link,a:active,a:visited {
    color : #000000;
    }
a:hover{
    text-decoration: underline;
    color : #494949;
    }
hr{
    height: 0px;
    border: solid #a7e1ff 0px;
    border-top-width: 1px;
   }
.bodyline{
    background-color: #8EC1D8;
    border: 1px #b6ddee solid;
   }
.bodylinewidth {
   width:85%
        }
.forumline{
    background-color: #cedfff;
    border: 2px #eaf4ff solid;
    }
td.row1{
    background-color: #c0daff;
    }
td.row2{
    background-color: #c0daff;
    }
td.row3{
    background-color: #c0daff;
    }
td.rowpic {
   background-color: #9ad6ff;
   background-image: url("http://hitskin.com/themes/11/73/60/i_back_catd.png");
   }
th {
   color: #ffffff;
    font-size: 11px;
    font-weight : bold;
   background-color: #8baab9;
    height: 25px;
   background-image: url("http://hitskin.com/themes/11/73/60/i_back_catg.png");
   }
td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
   background-image: url("http://hitskin.com/themes/11/73/60/i_back_catg.png");
   background-color:#9ad6ff;
    border: #8299b0;
    border-style: solid;
    height: 28px;
   }
td.cat,td.catHead,td.catBottom {
   height: 29px;
   border-width: 0px 0px 0px 0px;
   }
th.thHead,th.thSides,th.thTop,th.thLeft,th.thRight,th.thBottom,th.thCornerL,th.thCornerR {
   font-weight: bold;
    border: #ffffff;
    border-style: solid;
    height: 28px;
   }
td.row3Right,td.spaceRow {
   background-color: #c0daff;
    border: #8299b0;
    border-style: solid;
   }
td.pourcentback {
    background-color : #3c8fb4;
    }
th.thHead,td.catHead {
    font-size: 12px;
    border-width: 1px 1px 0px 1px;
    }
th.thSides,td.catSides,td.spaceRow {
    border-width: 0px 1px 0px 1px;
    }
th.thRight,td.catRight,td.row3Right {
    border-width: 0px 1px 0px 0px;
    }
th.thLeft,td.catLeft {
    border-width: 0px 0px 0px 1px;
    }
th.thBottom,td.catBottom {
    border-width: 0px 1px 1px 1px;
    }
th.thTop {
    border-width: 1px 0px 0px 0px;
    }
th.thCornerL {
    border-width: 1px 0px 0px 1px;
    }
th.thCornerR {
    border-width: 1px 1px 0px 0px;
    }
.maintitle, .maintitle h1{
   font-weight: bold;
    font-size: 22px;
    font-family: TrebuchetMS,Verdana,Arial,Helvetica,sans-serif;
   text-decoration: none;
    line-height : 120%;
    color : #000000;
   }
.maintitle h1 {
   margin: 0;
    padding: 0;
    display: inline;
   }
.gen {
    font-size : 12px;
    }
.genmed {
    font-size : 11px;
    }
.gensmall {
    font-size : 10px;
    }
.gen,.genmed,.gensmall {
    color : #000000;
    }
a.gen,a.genmed,a.gensmall {
    color: #000000;
    text-decoration: none;
    }
a.gen:hover,a.genmed:hover,a.gensmall:hover{
    color: #494949;
    text-decoration: underline;
    }
.mainmenu{
    font-size : 11px;
    color : #000000 }
a.mainmenu{
    text-decoration: none;
    color : #000000;
   }
a.mainmenu:hover{
    text-decoration: underline;
    color : #494949;
    }
.cattitle{
    font-weight: bold;
    font-size: 12px ;
    letter-spacing: 1px;
    color : #000000}
h1.cattitle {
   margin:0;
    padding: 0;
    display:inline;
   }
a.cattitle{
    text-decoration: none;
    color : #000000;
    }
a.cattitle:hover{
    text-decoration: underline;
    }
.forumlink{
    font-weight: bold;
    font-size: 12px;
    color : #000000;
    }
a.forumlink {
    text-decoration: none;
    color : #000000;
    }
a.forumlink:hover{
    text-decoration: underline;
    color : #494949;
    }
.nav{
    font-weight: bold;
    font-size: 11px;
    color : #000000;
    }
a.nav{
    text-decoration: none;
    color : #000000;
    }
a.nav:hover{
    text-decoration: underline;
    }
.topictitle,h1,h2{
    font-weight: bold;
    font-size: 11px;
    color : #000000;
    }
div.topictitle {
   display: inline;
   }
h2.topic-title {
   display: inline;
    margin: 0;
    padding: 0;
   }
a.topictitle:link{
    text-decoration: none;
    color : #000000;
    }
a.topictitle:visited{
    text-decoration: none;
    color : #000000;
    }
a.topictitle:hover{
    text-decoration: underline;
    color : #494949;
    }
.name{
    font-size : 11px;
    color : #000000;
   }
.postdetails{
    font-size : 10px;
    color : #000000;
    }
.postbody{
    font-size : 12px;
    line-height: 18px}
a.postlink:link{
    text-decoration: none;
    color : #000000 }
a.postlink:visited{
    text-decoration: none;
    color : #000000;
    }
a.postlink:hover{
    text-decoration: underline;
    color : #494949}
.code{
    font-family: Courier,CourierNew,sans-serif;
    font-size: 11px;
    color: #057500;
   background-color: #8fa4b9;
    border: #a7e1ff;
    border-style: solid;
   border-left-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px}
.quote{
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 11px;
    color: #040404;
    line-height: 125%;
   background-color: #8fa4b9;
    border: #a7e1ff;
    border-style: solid;
   border-left-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px}
.copyright{
    font-size: 10px;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    color: #000000;
    letter-spacing: -1px;
   }
a.copyright{
    color: #000000;
    text-decoration: none;
   }
a.copyright:hover {
    color: #494949;
    text-decoration: underline;
   }
.coloradmin {
    color: #93076d}
.colormod {
    color: #057500}
h1.pagetitle {
   display: inline;
   margin: 0;
   padding: 0;
   font-size: 12px;
   color: #ffffff;
   }
h1.title2 {
   font-size: 11px;
   }
.secondarytitle,.secondarytitle h2 {
   margin: 0;
   padding: 0;
   color: #ffffff;
   }
.secondarytitle h2 {
   display:inline;
   }
.nav h1 {
   display: inline;
   }
.hierarchy {
   display: inline;
   text-transform: none;
   border: none;
   font-size: 10px;
   }
.mod-text {
   font-weight: bold;
   }
img{
   border:0}
input,textarea, select {
   color : #000000;
   font: normal 11px Verdana,Arial,Helvetica,sans-serif;
   border-color : #000000;
   }
input.post, textarea.post, select {
    background-color : #ffffff;
    }
input {
    text-indent : 2px;
    }
input.button {
   background-color : #c0daff;
   color : #000000;
   font-size: 11px;
    font-family: Verdana,Arial,Helvetica,sans-serif;
   }
input.mainoption {
   background-color : #8fa4b9;
   font-weight : bold;
   }
input.liteoption {
   background-color : #8fa4b9;
   font-weight : normal;
   }
.helpline {
    background-color: #c0daff;
    border-style: none;
    }
input {
    background-color: #c0daff;
    }
button.button2, input.button2 {
   font-size: 0.7em;
   border: 1px solid #BCBCBC;
   width: auto !important;
   padding: 1px 0px;
   font-family: Verdana,Arial,Helvetica,sans-serif;
   color: #000000;
   background-repeat: repeat-x;
   background-color: #FAFAFA;
   background-image: url('http://illiweb.com/fa/prosilver/bg_button.gif');
   background-position: top;
   overflow: visible;
   vertical-align:middle;
   }
button.button2:hover, input.button2:hover {
   border: 1px solid #494949;
   color: #494949;
   background-position: 0 100%;
   }
* html button.button2, * html input.button2 {
   padding-bottom: 0;
   margin-bottom: 1px;
   height: 24px;
   padding-right: 3px;
   padding-left: 3px;
   }
*+html button.button2, *+html input.button2 {
   height: 24px;
   padding-right: 3px;
   padding-left: 3px;
   }
*+html button.button2 img {
    vertical-align: middle;
    }
* html button.button2 img {
    vertical-align: middle;
    }
button.bbcode {
   border: 1px solid #e3adad;
   background-image: url("http://illiweb.com/fa/wysiwyg/bg_button.png");
   }
.select {
   background-color: #FFFFFF;
   border: 1px solid #BCBCBC;
   position: absolute;
   z-index: 999;
   top: 0;
   left: 0;
   overflow: hidden;
   width: 0px;
   }
.selectHover {
    cursor: pointer;
    background-color: #EEEEEE;
   }
.select p {
   padding: 4px 6px;
   font-size: 0.7em;
   margin: 0px;
   white-space: nowrap;
   text-align: left;
   }
.select button {
   padding: 4px;
   font-size: 0.9em;
   margin: 0px;
   background-color: #FFF;
   border: none;
   text-align:left;
   }
.select button.button2 {
   border:1px solid #BCBCBC;
   padding: 0px;
   }
* html .select button.button2 {
   padding-right: 3px;
   padding-left: 3px;
   }
.select button.button2:hover {
   border: 1px solid #494949;
   color: #494949;
   background-position: 0 100%;
   }
textarea#text_editor_textarea {
    width: 100% !important;
    }
iframe#text_editor_iframe {
   width: 100%;
   height: 200px;
   }
form#quick_reply textarea#text_editor_textarea {
   width: 100% !important;
   height: 100%;
   }
form#quick_reply iframe#text_editor_iframe {
    width: 100%;
    }
* html form#quick_reply iframe#text_editor_iframe {
    width: 600px;
    }
*+html form#quick_reply iframe#text_editor_iframe {
    width: 600px;
    }
#page-footer .gen strong {
   font-weight: normal;
   }
@import url("form_ie.css");
   @media print {
   body {
   background-image: none;
   background-color: #fff;
   color: #000;
   }
table.bodylinewidth span.maintitle {
   display: block;
   text-align: left;
   }
table.bodylinewidth img#i_logo,.browse-arrows,.noprint,.messaging,.post-options,.poster-profile,img.i_icon_online,table.bodylinewidth .mainmenu,table.bodylinewidth .nav,table.bodylinewidth .gensmall,span.postdetails img,table.bodylinewidth .sig,table.bodylinewidth .catbottom,#info_open {
   display:none;
   }
td.catHead, .t-title {
   text-align: left;
   }
table.bodylinewidth .cattitle {
   letter-spacing: normal;
    font-size: 1em;
   }
.thLeft,.thRight {
   color: #000;
    border: none;
    text-align:left;
   }
.hr hr {
    visibility: hidden;
    }
.hr {
   border-top: 1px dotted #ddd !important;
    }
tr.post td {
   vertical-align: top;
   border-bottom: 1px solid #ccc;
   }
tr.post td td {
   border: none;
   }
span.gen {
   display: none;
   }
}
ul.abuse {
   list-style: none;
   line-height: 1.5em;
   font-size: 0.9em;
   }
.rtl-spacer:before {
   content: " ";
   white-space: pre;
   }
.rtl-spacer:after {
   content: " ";
   white-space: pre;
   }
.warning {
   color:#ff3333;
   }
.captcha div.captcha-img {
   float: left;
   margin: 0 1em 0 0;
   }
.captcha .inputbox {
   margin-top: 0.5em;
   }
.center {
   text-align: center;
   }
.right {
   float: right;
   }
.left {
   float: left;
   }

/* TGF Clearfix */
.clearfix:after {
   content: ".";
   display: block;
   height: 0;
   clear: both;
   visibility: hidden;
   }
*+ html .clearfix {
   min-height: 1px;
   }
* html .clearfix {
   position: relative;
    height: 1%;
    clear: both;
   }
#page-footer {
   clear: both;
   }
#page-footer h3 {
    margin-top: 20px;
    }
#add-google {
    text-align: center;
    margin: 0 auto;
   }
#content-container #left {
   width: 0px;
   margin-right: px;
   }
#content-container #right {
   width: 0px;
   margin-left: px;
   }
.module-title {
   font-weight: bold;
   margin: 0 auto;
   text-align: center;
   display: block;
   }
#frame_chatbox {
   border: none !important;
   }

/* Chatbox */
#chatbox_members {
   position: absolute;
   top: 30px;
   bottom: 30px;
   width: 180px;
   overflow: auto;
   border-right: 1px solid ;
   }
#chatbox {
   position: absolute;
   top: 30px;
   left: 181px;
   right: 0;
   bottom: 30px;
   overflow: auto;
   line-height: 10px;
   }
.chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {
   font-size: 12px;
   }
#chatbox_footer {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   }
#chatbox_footer table.text-styles {
   float: right;
   }
#chatbox_footer .text-field {
   float: left;
   }
#chatbox_footer .chatfootertable {
   margin: 5px;
   }

/*Internet Explorer fixers and hacks for Chatbox*
/* html #chatbox-members {
   
/* IE expressions helping IE work in Standards mode */
height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");
   }
* html #chatbox {
   
/* IE expressions helping IE work in Standards mode */
height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");
   width: expression(( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 10) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 1) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 1.3) ) + "px");
   }
* html #chatbox-footer {
   
/* IE expressions helping IE work in Standards mode */
width: expression(( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 0) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 0) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");
   

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Calιbuяn on January 29th 2013, 2:58 pm

Code:
@import url("form_ie.css");
  @media print {
  body {
  background-image: none;
  background-color: #fff;
  color: #000;
  }
I believe this is your issue.

Calιbuяn
Forumember

Male Posts : 386
Reputation : 38
Language : English
Location : Detroit, MI

http://lazarusexp.forumotion.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 29th 2013, 3:06 pm

Thank you, can you tell me what I need to do because I don't know anything about coding. Embarassed

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by SLGray on January 29th 2013, 9:22 pm

I see a lot of lines which do not have semicolons right before the closing }.

For example:
Code:
.bodylinewidth {
  width:85%
        }
It should be this:
Code:
.bodylinewidth {
  width:85%;
        }


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36681
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 29th 2013, 9:36 pm

Even without the added code it still gives the same message? but the forum is running fine so maybe its another error ?

I have been looking at using this code in the overall header template but I need to know how to add a second one at the side, I tried just adding the code twice but it puts one on top of the other instead of side by side, so if you can tell me how to modify for side by side banners, this code it will work fine.

Code:
<a href="URL HERE"><img src="IMAGE TO GO HERE"></a>
<br>


Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by SLGray on January 29th 2013, 9:44 pm

Using <br> makes the next thing go under the one before the <br>.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36681
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 29th 2013, 9:49 pm

So what should I do to get it to go to the side like this but with a small space between them



And not like this




Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 1:08 am

I put this in

#i_logo, #secondLogo {
width: 95%;
}

and I got this in the CSS {" and of "}

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 1:15 am

Rideem3 wrote:Replace your CSS with this:
Code:
body {
  background-color: #3c8fb4;
  background-image: url("http://i31.servimg.com/u/f31/12/11/05/42/sans-t11.png");
  background-attachment: scroll;
        background-repeat: repeat-x;
  scrollbar-face-color: #dee3e7;
  scrollbar-highlight-color: #000000;
  scrollbar-shadow-color: #dee3e7;
  scrollbar-3dlight-color: #d1d7dc;
  scrollbar-arrow-color: #006699;
  scrollbar-track-color: #efefef;
  scrollbar-darkshadow-color: #98aab1;
        }
#i_logo, #secondLogo {
width: 95%;
}

th,td,p {
    font-family: Verdana,Arial,Helvetica,sans-serif }
a img {
    border: none;
    }
a:link,a:active,a:visited {
    color : #000000;
    }
a:hover{
    text-decoration: underline;
    color : #494949;
    }
hr{
    height: 0px;
    border: solid #a7e1ff 0px;
    border-top-width: 1px;
  }
.bodyline{
    background-color: #8EC1D8;
    border: 1px #b6ddee solid;
  }
.bodylinewidth {
  width:85%
        }
.forumline{
    background-color: #cedfff;
    border: 2px #eaf4ff solid;
    }
td.row1{
    background-color: #c0daff;
    }
td.row2{
    background-color: #c0daff;
    }
td.row3{
    background-color: #c0daff;
    }
td.rowpic {
  background-color: #9ad6ff;
  background-image: url("http://hitskin.com/themes/11/73/60/i_back_catd.png");
  }
th {
  color: #ffffff;
    font-size: 11px;
    font-weight : bold;
  background-color: #8baab9;
    height: 25px;
  background-image: url("http://hitskin.com/themes/11/73/60/i_back_catg.png");
  }
td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
  background-image: url("http://hitskin.com/themes/11/73/60/i_back_catg.png");
  background-color:#9ad6ff;
    border: #8299b0;
    border-style: solid;
    height: 28px;
  }
td.cat,td.catHead,td.catBottom {
  height: 29px;
  border-width: 0px 0px 0px 0px;
  }
th.thHead,th.thSides,th.thTop,th.thLeft,th.thRight,th.thBottom,th.thCornerL,th.thCornerR {
  font-weight: bold;
    border: #ffffff;
    border-style: solid;
    height: 28px;
  }
td.row3Right,td.spaceRow {
  background-color: #c0daff;
    border: #8299b0;
    border-style: solid;
  }
td.pourcentback {
    background-color : #3c8fb4;
    }
th.thHead,td.catHead {
    font-size: 12px;
    border-width: 1px 1px 0px 1px;
    }
th.thSides,td.catSides,td.spaceRow {
    border-width: 0px 1px 0px 1px;
    }
th.thRight,td.catRight,td.row3Right {
    border-width: 0px 1px 0px 0px;
    }
th.thLeft,td.catLeft {
    border-width: 0px 0px 0px 1px;
    }
th.thBottom,td.catBottom {
    border-width: 0px 1px 1px 1px;
    }
th.thTop {
    border-width: 1px 0px 0px 0px;
    }
th.thCornerL {
    border-width: 1px 0px 0px 1px;
    }
th.thCornerR {
    border-width: 1px 1px 0px 0px;
    }
.maintitle, .maintitle h1{
  font-weight: bold;
    font-size: 22px;
    font-family: TrebuchetMS,Verdana,Arial,Helvetica,sans-serif;
  text-decoration: none;
    line-height : 120%;
    color : #000000;
  }
.maintitle h1 {
  margin: 0;
    padding: 0;
    display: inline;
  }
.gen {
    font-size : 12px;
    }
.genmed {
    font-size : 11px;
    }
.gensmall {
    font-size : 10px;
    }
.gen,.genmed,.gensmall {
    color : #000000;
    }
a.gen,a.genmed,a.gensmall {
    color: #000000;
    text-decoration: none;
    }
a.gen:hover,a.genmed:hover,a.gensmall:hover{
    color: #494949;
    text-decoration: underline;
    }
.mainmenu{
    font-size : 11px;
    color : #000000 }
a.mainmenu{
    text-decoration: none;
    color : #000000;
  }
a.mainmenu:hover{
    text-decoration: underline;
    color : #494949;
    }
.cattitle{
    font-weight: bold;
    font-size: 12px ;
    letter-spacing: 1px;
    color : #000000}
h1.cattitle {
  margin:0;
    padding: 0;
    display:inline;
  }
a.cattitle{
    text-decoration: none;
    color : #000000;
    }
a.cattitle:hover{
    text-decoration: underline;
    }
.forumlink{
    font-weight: bold;
    font-size: 12px;
    color : #000000;
    }
a.forumlink {
    text-decoration: none;
    color : #000000;
    }
a.forumlink:hover{
    text-decoration: underline;
    color : #494949;
    }
.nav{
    font-weight: bold;
    font-size: 11px;
    color : #000000;
    }
a.nav{
    text-decoration: none;
    color : #000000;
    }
a.nav:hover{
    text-decoration: underline;
    }
.topictitle,h1,h2{
    font-weight: bold;
    font-size: 11px;
    color : #000000;
    }
div.topictitle {
  display: inline;
  }
h2.topic-title {
  display: inline;
    margin: 0;
    padding: 0;
  }
a.topictitle:link{
    text-decoration: none;
    color : #000000;
    }
a.topictitle:visited{
    text-decoration: none;
    color : #000000;
    }
a.topictitle:hover{
    text-decoration: underline;
    color : #494949;
    }
.name{
    font-size : 11px;
    color : #000000;
  }
.postdetails{
    font-size : 10px;
    color : #000000;
    }
.postbody{
    font-size : 12px;
    line-height: 18px}
a.postlink:link{
    text-decoration: none;
    color : #000000 }
a.postlink:visited{
    text-decoration: none;
    color : #000000;
    }
a.postlink:hover{
    text-decoration: underline;
    color : #494949}
.code{
    font-family: Courier,CourierNew,sans-serif;
    font-size: 11px;
    color: #057500;
  background-color: #8fa4b9;
    border: #a7e1ff;
    border-style: solid;
  border-left-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px}
.quote{
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 11px;
    color: #040404;
    line-height: 125%;
  background-color: #8fa4b9;
    border: #a7e1ff;
    border-style: solid;
  border-left-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px}
.copyright{
    font-size: 10px;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    color: #000000;
    letter-spacing: -1px;
  }
a.copyright{
    color: #000000;
    text-decoration: none;
  }
a.copyright:hover {
    color: #494949;
    text-decoration: underline;
  }
.coloradmin {
    color: #93076d}
.colormod {
    color: #057500}
h1.pagetitle {
  display: inline;
  margin: 0;
  padding: 0;
  font-size: 12px;
  color: #ffffff;
  }
h1.title2 {
  font-size: 11px;
  }
.secondarytitle,.secondarytitle h2 {
  margin: 0;
  padding: 0;
  color: #ffffff;
  }
.secondarytitle h2 {
  display:inline;
  }
.nav h1 {
  display: inline;
  }
.hierarchy {
  display: inline;
  text-transform: none;
  border: none;
  font-size: 10px;
  }
.mod-text {
  font-weight: bold;
  }
img{
  border:0}
input,textarea, select {
  color : #000000;
  font: normal 11px Verdana,Arial,Helvetica,sans-serif;
  border-color : #000000;
  }
input.post, textarea.post, select {
    background-color : #ffffff;
    }
input {
    text-indent : 2px;
    }
input.button {
  background-color : #c0daff;
  color : #000000;
  font-size: 11px;
    font-family: Verdana,Arial,Helvetica,sans-serif;
  }
input.mainoption {
  background-color : #8fa4b9;
  font-weight : bold;
  }
input.liteoption {
  background-color : #8fa4b9;
  font-weight : normal;
  }
.helpline {
    background-color: #c0daff;
    border-style: none;
    }
input {
    background-color: #c0daff;
    }
button.button2, input.button2 {
  font-size: 0.7em;
  border: 1px solid #BCBCBC;
  width: auto !important;
  padding: 1px 0px;
  font-family: Verdana,Arial,Helvetica,sans-serif;
  color: #000000;
  background-repeat: repeat-x;
  background-color: #FAFAFA;
  background-image: url('http://illiweb.com/fa/prosilver/bg_button.gif');
  background-position: top;
  overflow: visible;
  vertical-align:middle;
  }
button.button2:hover, input.button2:hover {
  border: 1px solid #494949;
  color: #494949;
  background-position: 0 100%;
  }
* html button.button2, * html input.button2 {
  padding-bottom: 0;
  margin-bottom: 1px;
  height: 24px;
  padding-right: 3px;
  padding-left: 3px;
  }
*+html button.button2, *+html input.button2 {
  height: 24px;
  padding-right: 3px;
  padding-left: 3px;
  }
*+html button.button2 img {
    vertical-align: middle;
    }
* html button.button2 img {
    vertical-align: middle;
    }
button.bbcode {
  border: 1px solid #e3adad;
  background-image: url("http://illiweb.com/fa/wysiwyg/bg_button.png");
  }
.select {
  background-color: #FFFFFF;
  border: 1px solid #BCBCBC;
  position: absolute;
  z-index: 999;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 0px;
  }
.selectHover {
    cursor: pointer;
    background-color: #EEEEEE;
  }
.select p {
  padding: 4px 6px;
  font-size: 0.7em;
  margin: 0px;
  white-space: nowrap;
  text-align: left;
  }
.select button {
  padding: 4px;
  font-size: 0.9em;
  margin: 0px;
  background-color: #FFF;
  border: none;
  text-align:left;
  }
.select button.button2 {
  border:1px solid #BCBCBC;
  padding: 0px;
  }
* html .select button.button2 {
  padding-right: 3px;
  padding-left: 3px;
  }
.select button.button2:hover {
  border: 1px solid #494949;
  color: #494949;
  background-position: 0 100%;
  }
textarea#text_editor_textarea {
    width: 100% !important;
    }
iframe#text_editor_iframe {
  width: 100%;
  height: 200px;
  }
form#quick_reply textarea#text_editor_textarea {
  width: 100% !important;
  height: 100%;
  }
form#quick_reply iframe#text_editor_iframe {
    width: 100%;
    }
* html form#quick_reply iframe#text_editor_iframe {
    width: 600px;
    }
*+html form#quick_reply iframe#text_editor_iframe {
    width: 600px;
    }
#page-footer .gen strong {
  font-weight: normal;
  }
@import url("form_ie.css");
  @media print {
  body {
  background-image: none;
  background-color: #fff;
  color: #000;
  }
table.bodylinewidth span.maintitle {
  display: block;
  text-align: left;
  }
table.bodylinewidth img#i_logo,.browse-arrows,.noprint,.messaging,.post-options,.poster-profile,img.i_icon_online,table.bodylinewidth .mainmenu,table.bodylinewidth .nav,table.bodylinewidth .gensmall,span.postdetails img,table.bodylinewidth .sig,table.bodylinewidth .catbottom,#info_open {
  display:none;
  }
td.catHead, .t-title {
  text-align: left;
  }
table.bodylinewidth .cattitle {
  letter-spacing: normal;
    font-size: 1em;
  }
.thLeft,.thRight {
  color: #000;
    border: none;
    text-align:left;
  }
.hr hr {
    visibility: hidden;
    }
.hr {
  border-top: 1px dotted #ddd !important;
    }
tr.post td {
  vertical-align: top;
  border-bottom: 1px solid #ccc;
  }
tr.post td td {
  border: none;
  }
span.gen {
  display: none;
  }
}
ul.abuse {
  list-style: none;
  line-height: 1.5em;
  font-size: 0.9em;
  }
.rtl-spacer:before {
  content: " ";
  white-space: pre;
  }
.rtl-spacer:after {
  content: " ";
  white-space: pre;
  }
.warning {
  color:#ff3333;
  }
.captcha div.captcha-img {
  float: left;
  margin: 0 1em 0 0;
  }
.captcha .inputbox {
  margin-top: 0.5em;
  }
.center {
  text-align: center;
  }
.right {
  float: right;
  }
.left {
  float: left;
  }

/* TGF Clearfix */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  }
*+ html .clearfix {
  min-height: 1px;
  }
* html .clearfix {
  position: relative;
    height: 1%;
    clear: both;
  }
#page-footer {
  clear: both;
  }
#page-footer h3 {
    margin-top: 20px;
    }
#add-google {
    text-align: center;
    margin: 0 auto;
  }
#content-container #left {
  width: 0px;
  margin-right: px;
  }
#content-container #right {
  width: 0px;
  margin-left: px;
  }
.module-title {
  font-weight: bold;
  margin: 0 auto;
  text-align: center;
  display: block;
  }
#frame_chatbox {
  border: none !important;
  }

/* Chatbox */
#chatbox_members {
  position: absolute;
  top: 30px;
  bottom: 30px;
  width: 180px;
  overflow: auto;
  border-right: 1px solid ;
  }
#chatbox {
  position: absolute;
  top: 30px;
  left: 181px;
  right: 0;
  bottom: 30px;
  overflow: auto;
  line-height: 10px;
  }
.chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {
  font-size: 12px;
  }
#chatbox_footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  }
#chatbox_footer table.text-styles {
  float: right;
  }
#chatbox_footer .text-field {
  float: left;
  }
#chatbox_footer .chatfootertable {
  margin: 5px;
  }

/*Internet Explorer fixers and hacks for Chatbox*
/* html #chatbox-members {
 
/* IE expressions helping IE work in Standards mode */
height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");
  }
* html #chatbox {
 
/* IE expressions helping IE work in Standards mode */
height: expression(( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 3) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");
  width: expression(( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 10) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 1) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 1.3) ) + "px");
  }
* html #chatbox-footer {
 
/* IE expressions helping IE work in Standards mode */
width: expression(( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) - ( (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 0) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 0) + (parseInt(document.body.currentStyle.fontSize) * 1.3333333 * 2 * 0) ) + "px");
 }

Then add it.

Ok I have replaced the style sheet and added the first bit of code

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 1:26 am

I have added the code but I don't see anything? I also clicked all pages.

Code:
var secondLogo_src =http://i17.servimg.com/u/f17/17/18/67/35/image_13.jpg
        secondLogo_href =http://bangernomics.editboard.com;
    $(function () {
        $('.bodyline:first td:first').removeAttr('valign align width').css('width', '50%').after('<td style="width: 50%;"><a href="' + secondLogo_href + '" target="_blank"><img src="' + secondLogo_src + '" id="secondLogo" border="0" alt="" vspace="1"></a><br><div class="maintitle"><h1></h1></div><br><span class="gen"><br>  </span></td>');
    });

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 1:39 am

Sorry I missed them when I copied it. but I have done it how you said and still I see nothing?

Code:
var secondLogo_src = 'http://i17.servimg.com/u/f17/17/18/67/35/image_13.jpg',
    secondLogo_href = 'http://bangernomics.editboard.com';
$(function () {
    $('.bodyline:first td:first').removeAttr('valign align width').css('width', '50%').after('<td style="width: 50%;"><a href="' + secondLogo_href + '" target="_blank"><img src="' + secondLogo_src + '" id="secondLogo" border="0" alt="" vspace="1"></a><br><div class="maintitle"><h1></h1></div><br><span class="gen"><br>  </span></td>');

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Calιbuяn on January 30th 2013, 1:41 am

Copy Rideem's code exactly as it is and paste it in. You keep changing things, of course it won't work.

Calιbuяn
Forumember

Male Posts : 386
Reputation : 38
Language : English
Location : Detroit, MI

http://lazarusexp.forumotion.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by SLGray on January 30th 2013, 1:44 am

Why done you create one image with both banners on it with a transparent background?


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36681
Reputation : 2445
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 1:44 am

That's what I did and then I added the image url and the forum url

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 1:48 am

The Image I uploaded is a test image and its only 260 x 37 px even though its a copy of the header


Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 1:50 am

Still not showing

Code:
var secondLogo_src = 'http://i17.servimg.com/u/f17/17/18/67/35/image_13.jpg',
    secondLogo_href = 'http://bangernomics.editboard.com';
$(function () {
    $('.bodyline:first td:first').removeAttr('valign align width').css('width', '50%').after('<td style="width: 50%;"><a href="' + secondLogo_href + '" target="_blank"><img src="' + secondLogo_src + '" id="secondLogo" border="0" alt="" vspace="1"></a><br><div class="maintitle"><h1></h1></div><br><span class="gen"><br>  </span></td>');
});

From what I can see I have fixed it?



I have used a different logo, but now the problem is it has grown in size and it isn't below the nav buttons

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 2:06 am

I just want to say sorry for all the trouble I have created for you and to say thank you very much and I do understand if you have had enough of me. I'm afraid its old age.

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Re: Banners on forum need to be side by side

Post by Bangernomics on January 30th 2013, 2:11 am

Sorry I thought I had but looking back I didn't

I want to be able to put 3 small banners under the nav bar side by side

Bangernomics
Forumember

Female Posts : 144
Reputation : 1
Language : English
Location : UK

Back to top Go down

Page 1 of 2 1, 2  Next

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum