# Need code for two floating sidebar banners
**URL:** https://meta.discourse.org/t/need-code-for-two-floating-sidebar-banners/133211
**Category:** Marketplace
**Created:** [November 12, 2019, 4:42pm UTC](https://meta.discourse.org/t/need-code-for-two-floating-sidebar-banners/133211 "2019-11-12T16:42:28Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@steelmaiden](https://meta.discourse.org/u/steelmaiden)
#### Post date: [November 12, 2019, 4:42pm UTC](https://meta.discourse.org/t/need-code-for-two-floating-sidebar-banners/133211/1 "2019-11-12T16:42:28Z")
I need someone to create a code which ads the two floating banners in sidebars of the desktop version of my forum.
I can pay $50 for this job.
---
### Author:  [@anon48433008](https://meta.discourse.org/u/anon48433008)
#### Post date: [December 5, 2019, 2:21pm UTC](https://meta.discourse.org/t/need-code-for-two-floating-sidebar-banners/133211/2 "2019-12-05T14:21:09Z")
I’ll offer up what I’ve been working on,
its piecemeal, incomplete and being made for image banners
but can be changed for text
the biggest issue at the moment is screen size, you’ll see `@media screen and (max-width: 1800px)`
where the images shrink for a smaller screen
That’s not enough and will need to be either added to for even smaller screens or more likely can be vastly improved with a full auto code,
hopefully you can make it work and put your $50 towards someones holiday happiness
Full disclosure I do not play a computer programmer on TV and I did not stay at a Holiday Inn last night, this is what it is, a base template and an offer to help with no guarantees , I was doing this as a component for a site I can not do a plug-in on
> **HTML**
>
> ```
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
> ```
> **Desktop CSS**
>
> ```
> /* left sidebar */
> .sidenav1 {
> resize: both;
> overflow: auto;
> // height: 100%;
> // width: 160px;
> position: fixed;
> z-index: 1;
> top: 100px;
> left: 2em;
> background-color: transparent;
> overflow-x: hidden; /* Disable horizontal scroll */
> //padding-top: 20px;
> }
>
> /* The navigation menu links */
> .sidenav1 a {
> //padding: 6px 8px 6px 16px;
> text-decoration: none;
> font-size: 25px;
> color: #000;
> display: block;
> cursor:url("my custom"), default;
> }
>
> /* When you mouse over the navigation links, change their color */
> .sidenav1 a:hover {
> color: #f1f1f1;
> }
>
> @media screen and (max-width: 1800px) {
> .sidenav1 {left: 3.5em;}
> .sidenav1 a {font-size: 18px;}
> .sidenav1 img {width: 70%;}
> .sidenav1 img {height: auto;}
> }
>
> //////////
>
> /* The sidebar menu */
> .sidenav2 {
> resize: both;
> overflow: auto;
> // height: 100%;
> // width: 160px;
> position: fixed;
> z-index: 1;
> top: 100px;
> right: 2em;
> background-color: transparent;
> overflow-x: hidden; /* Disable horizontal scroll */
> //padding-top: 20px;
> }
>
> /* The navigation menu links */
> .sidenav2 a {
> //padding: 6px 8px 6px 16px;
> text-decoration: none;
> font-size: 25px;
> color: #000;
> display: block;
> cursor:url("my custom"), default;
> }
>
> .sidenav2 a:hover {
> color: #f1f1f1;
> }
>
> @media screen and (max-width: 1800px) {
> .sidenav2 {right: -2em;}
> .sidenav2 a {font-size: 18px;}
> .sidenav2 img {width: 70%;}
> .sidenav2 img {height: auto;}
> }
>
> ```
Good luck.
---
### Author:  [@system](https://meta.discourse.org/u/system)
#### Post date: [January 4, 2020, 2:22pm UTC](https://meta.discourse.org/t/need-code-for-two-floating-sidebar-banners/133211/3 "2020-01-04T14:22:42Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.