Color Background in Side Bar Navigation Include

I have two columns in the sub-pages of my website. In column one, I have a sidebar navigation as an include and trying to add a color background. I can't get it to work, where it automatically adjusts to the length of the content area in column two of the webpage. So, on some pages the column one shading does not stretch as long as it needed.
I heard this is complicated to do to have it auto format rather than have a set area. Does anyone know how to code this correctly?

This is less a code thing and more of a technique thing. Make a 2-toned background image the same width as your page #wrapper and repeat it vertically with CSS. This technique is called Faux Columns.
You can see a working demo here:
http://alt-web.com/TEMPLATES/2-column-fixed-width-template.shtml
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Similar Messages

Side Bar Navigation problem

Hi All
I am using Side Bar Navigation in My Pages.The problem is Link names are Big.
So whe page renders along with Side Bar Navigation ,Link get Wrapped up and appears in two line which looks weard. I dont want this to happen.One Link should come in one line only.
Any Idea to how to control this??
Regards
Naveen

No way to control this, this is a standard widget and users have no control over this.
Thanks
Tapash

How can change background color of drop down menu navigation?

Hi,
I am using multi level drop-down-navigation menu in my website.
I am get good drop-down menu from htmldrive.net, but problem is how can change menu background color black to other colors.
please help me
Link & code is given below
http://www.htmldrive.net/items/demo/913/Multi-Level-Drop-Down-Menu-Navigation-with-CSS3
HTML Code
<div id="nav">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Our Portfolio</a></li>
<li><a href="#">One Dropdown</a>
        <ul>
        <li><a href="#">Level 2.1</a></li>
        <li><a href="#">Level 2.2</a></li>
        <li><a href="#">Level 2.3</a></li>
        <li><a href="#">Level 2.4</a></li>
        <li><a href="#">Level 2.5</a></li>
        </ul>
</li>
<li><a href="#">Three Levels</a>
        <ul>
        <li><a href="#">Level 2.1</a></li>
        <li><a href="#">Level 2.2</a></li>
        <li><a href="#">Level 2.3</a>
                <ul>
                <li><a href="#">Level 2.3.1</a></li>
                <li><a href="#">Level 2.3.2</a></li>
                <li><a href="#">Level 2.3.3</a></li>
                <li><a href="#">Level 2.3.4</a></li>
                <li><a href="#">Level 2.3.5</a></li>
                <li><a href="#">Level 2.3.6</a></li>
                <li><a href="#">Level 2.3.7</a></li>
                </ul>
        </li>
        <li><a href="#">Level 2.4</a></li>
        <li><a href="#">Level 2.5</a></li>
        </ul>
</li>
<li><a href="#">Services</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</div>
CSS CODE
#nav {
        float: left;
        font: bold 12px Arial, Helvetica, Sans-serif;
        border: 1px solid #121314;
        border-top: 1px solid #2b2e30;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        overflow: hidden;
#nav ul {
        margin:0;
        padding:0;
        list-style:none;
#nav ul li {
        float:left;
#nav ul li a {
        float: left;
        color:#d4d4d4;
        padding: 10px 20px;
        text-decoration:none;
        background:#3C4042;
        background: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(59,63,65)), color-stop(0.55, rgb(72,76,77)), color-stop(0.78, rgb(75,77,77)) );
        background: -moz-linear-gradient( center bottom, rgb(59,63,65) 9%, rgb(72,76,77) 55%, rgb(75,77,77) 78% );
        background: -o-linear-gradient( center bottom, rgb(59,63,65) 9%, rgb(72,76,77) 55%, rgb(75,77,77) 78% );
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 5px rgba(0, 0, 0, 0.1) inset;
        border-left: 1px solid rgba(255, 255, 255, 0.05);
        border-right: 1px solid rgba(0,0,0,0.2);
        text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.6);
#nav li ul {
        background:#3C4042;
        background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(77,79,79)), color-stop(0.55, rgb(67,70,71)), color-stop(0.78, rgb(69,70,71)) );
        background-image: -moz-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
        background-image: -o-linear-gradient( center bottom, rgb(77,79,79) 9%, rgb(67,70,71) 55%, rgb(69,70,71) 78% );
        border-radius: 0 0 10px 10px;
        -moz-border-radius: 0 0 10px 10px;
        -webkit-border-radius: 0 0 10px 10px;
        left: -999em;
        margin: 35px 0 0;
        position: absolute;
        width: 160px;
        z-index: 9999;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
        -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
        -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) inset;
        border: 1px solid rgba(0, 0, 0, 0.5);
#nav li ul a {
        background: none;
        border: 0 none;
        margin-right: 0;
        width: 120px;
        box-shadow: none;
        -moz-box-shadow: none;
        -webkit-box-shadow: none;
        border-bottom: 1px solid transparent;
        border-top: 1px solid transparent;

Change this:
.ddsmoothmenu{
font: bold 12px Verdana;
background: #414141; /*background of menu bar (default state)*/
width: 100%;
to this:
.ddsmoothmenu{
font: bold 12px Verdana;
background: #new color code;
width: 100%;
And repeat this on other selectors.
Nancy O.

Need transparent background color in Spry Menu Bar

Tried every possible combination.
Built a 150x1000 px header in Illustrator with a 20x1000 px rectangle at the bottom for the nav bar, set as a background image in the header within Dreamweaver.
Can not make a transparent (no color) background within Spry Menu Bar: MenuBar1??
Also, my first nav is 'Welcome' that <li></li> is about 6-8 px higher then the rest of the nav bar??
Any help at all would be appreciated, thanks
optionsclinic.net

Have you tried changing the value of the Background colour in your CSS:
ul.MenuBarHorizontal a
    cursor: pointer;
    text-align: center;
    padding-top: 2px;
    padding-bottom: 2px;
    text-decoration: none;
    color: #FFF;
    padding-right: 2px;
    padding-left: 2px;
    display: block;
    background-color: #223F9A;

Hiding navigation panes (side bar) using metadata or reader setting?

Hi all,
as the title already mentioned,
I'm trying to get a pdf file generated using JasperReport displayed in the reader (within web browser) without the side bar/Nav. pane.
At first I thought that should be done from the reader configuraton/setting, but then I found out that that's not completely correct.
I can indeed hide the sidebar by using the parameter navpanes=0 as part of the URL. But this works only for version 6.* upwards(?).
Now, I have in my hand 2 pdf files which I opened using the same reader (ver. 8). And one file is being shown with and the other without the sidebar.
Can anyone please help me with any hints/idea?
ps: I attached screenshots from both of the files. The one with sidebar has also darker grey background (which I think is normal) and the other one without has a lighter gray background
Thanks in advance
Regards
Brody

I wonder if anyone can tell me easily how to make the submenu's under the horizontal menu bar also appear horizontally?
This question is more suited to the Spry forum.

Website help: Creating a side bar then the main part of the webpage??

Hi guys, im currently making a website in dreamweaver but ive coe into some problems and theyve got me stumped...
basically, i have been using dreamweaver and ive managed to create a side bar for my website with separate div tages etc and now i want to create the main body of the page, eg the menu and the images but i cant get it do do what i want it to do...
when i insert the div tag for the main body part of my page it is placed above the side bar when i want it to the side of it, inline with it.... /: its fustrting cust ive been able to style all of the side bar and ive wanted to complete the rest of the site but currently im unable to...

OK, here is how you need to look at your page:
The outermost defined area is the body. Generally, to set up a website, you create basic "applies to all" stuff in the body definitions in your style sheet:
For example:
body {
          font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
          color: #000;
          background-color: #FFFFFF;
          margin: 20px 0;
          padding: 0px;
That's going to create normal paragraph text in the website as Lucidia Sans (or Lucidia Grande if the client doesn't have that defaulting to sans-serif if that is not available), text color is black, background is white, top margin is 20 pixels, clear left and right margins and clear all padding.
Now, you need to enclose the "website" into something that encases everything and I usually call that an outer wrapper.
.outer-Wrapper {
          width: 80%;
          max-width: 1260px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
          min-width: 780px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
          background: #FFF;
          margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
Explanations in comments.
Now, you set up the rest of your page:
.header {
#nav {
          margin-left: 20%;
/* ~~ These are the columns for the layout. ~~
1) Padding is only placed on the top and/or bottom of the divs. The elements within these divs have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
2) No margin has been given to the columns since they are all floated. If you must add margin, avoid placing it on the side you're floating toward (for example: a right margin on a div set to float right). Many times, padding can be used instead. For divs where this rule must be broken, you should add a "display:inline" declaration to the div's rule to tame a bug where some versions of Internet Explorer double the margin.
3) Since classes can be used multiple times in a document (and an element can also have multiple classes applied), the columns have been assigned class names instead of IDs. For example, two sidebar divs could be stacked if necessary. These can very easily be changed to IDs if that's your preference, as long as you'll only be using them once per document.
4) If you prefer your nav on the right instead of the left, simply float these columns the opposite direction (all right instead of all left) and they'll render in reverse order. There's no need to move the divs around in the HTML source.
.sidebar {
          float: left;
          width: 20%;
          background-color: #cccccc;
          padding-bottom: 10px;
          color: #FFF;
.content {
          padding: 10px 0;
          width: 80%;
          float: left;
          color: #000;
Lastly, you want your footer to be below both columns, so you define that:
.footer {
          padding: 10px 0;
          position: relative;/* this gives IE6 hasLayout to properly clear */
          clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
          background-color: #eeeeee; /*This makes it gray so that it is separated from the rest of the page, but isn't too dark for black text */
Now, let's go to the html:
Define your page. Dreamweaver will allow you to define a page as XHTML 1.0 transitional or strict or XHTML 1.1, HTML 4.01 transitional or strict or HTML5. Older versions of Dreamweaver have no HTML5 and may have older versons of HTML, but I either use XHTML 1.0 transitional or HTML5. There are good reasons for this.
Dreamweaver will set up the site definitions depending on what you choose above the <head> area.
Within the <head> area, you define the character set, give a title (make it unique for each page in your website) and point to your style sheet. You can use Dreamweaver's "Attach stylesheet." Any calls to JavaScript go here as well. If you have a separate style sheet for a drop-down menu structure or any other navigation, it will go there as well. Remember to close the <head> tag.
Now, we define the body and go into the page:
<body>
<div class="outer-Wrapper">
<div ="header"> Header Goes Here</div>
<div id="nav">Navigation placed here</div>
<div class="sidebar">Your sidebar will go here</div>
<div class="content">Your main content goes here and it will live to the right of your sidebar on the left</div>
<div class="footer">I generally put the copyright information here and sometimes additional navigation in the footer</div>
<div> 
</body>
</html>
This will absolutely work.

Problem with side bar

http://prosol1.com/mw_images/frontpage.jpg
hi - i can't seem to figure out why the side bar background in the above snapshot will not stretch down with the rest of this text. i tried copying and re-pasting the text, but no luck.
thanks - mike

A few changes to your CSS are required as shown below. Replace what you have now with this and it should work as expected in all browsers. Change links colors to whatever you wish.
.subnav {
     font-family: Arial, Helvetica, sans-serif;
     font-size: 12px;
     line-height: 1.5;
     background-color: #F3F3F3;
     padding-left: 20px;
     border: 1px solid #EAEAEA;
/**LINKS**/
.subnav a {display:block;}
.subnav a:link {color: maroon}
.subnav a:visited {color: blue}
.subnav a:hover {color: #FFF; background: #990000}
.subnav a:active {color: green}
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.com/blogspot.com

Displaying button images in the side bar

Hi guys,
I'm just finishing my first web site and i have noticed some problems with my side bar when i viewed the site in Safari. While i was developing i was only
checking firefox and IE. The site is www.becom.ie. On the CCTV page my buttons in the side bar have moved across and are occuping space in main content. I just cannot see what is causing the problem with the side bar buttons. They seem fine on every other page.
I have also fixed the problem you'll see with the header. I have added a float left property to the left image and every thing seems to be displaying ok. I just have to FTP the new changes to the header.
Here is my style sheet:
@charset "utf-8";
#body{
    margin: 0;
    padding: 0;
    font-size: 100%;
    text-align: center;
#wrapper {
    font-family: Arial, Helvetica, sans-serif;
    width: 960px;
    text-align: left;
    margin: 0 auto;
    border: 2px solid #CCC;
#header {
    margin: 0px;
    padding: 0px;
    width: 960px;
#header h1{
text-indent: 1111px;
#maincontent {
    width: 760px;
    float: right;
    padding-left: 20px;
    padding-right: 20px;
    color: #000;
    line-height: 1.8em;
    font-size: 0.80em;
#maincontent{
position: relative;
text-align: justify;
#maincontent img{
margin-top: 50px;
#maincontent ul{
    margin: 0;
    padding: 0;
    list-style: none;
    float: left;
    position: absolute;
    right: 0px;
    top: 0px;
    margin-top: 10px;
#maincontent li{
    float: left;
#maincontent li a:link, #maincontent li a:visited{
    background-color: #06c;
    padding: .2em 1.5em;
    display: block;
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 1em;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
    line-height: 1.2em;
    margin-right: 0.2em;
#maincontent li a:hover{
    color: #000;
    background-color: #FFF;
#maincontent li a.current, #maincontent li a.current:hover, #maincontent li a.current:active{
    color: #000;
    background-color: #fff;
    cursor: default;
#pictures{
float: left;
margin-bottom: 10px;
#digital_eye{
margin-top: 30px;
#images{
margin-top: 10px;
width: 960px;
clear: both;
#images ul{
line-height: 1.4em;
#images img{
margin-top: 10px;
#text{
width: 298px;
#sidebar{
float: left;
width: 150px;
padding-left: 10px;
margin-top: 55px;
# sidebar img a {
margin-bottom: 10px;
#list{
width: 950px;
margin-top: 20px;
clear: both;
line-height: 1.6em;
a img{
border: none;
#footer {
    clear: both;
    width: 949px;
    height: 144px;
    padding-left: 10px;
    vertical-align: bottom;
    font-size: .8em;
#footer #address {
    float: right;
#footer_img {
    float: left;
    margin-top: 0px;
#bottom{
margin: 0;
padding: 0;
background-color: #ccc;
#camerapic{
padding-left: 140px;
#ultimo{
padding-left: 196px;
.fltright{
float: right;
margin-left: 10px;
margin-right: 20px;
.centre{
text-align: center;
.right{
text-align: right;
.left{
padding-left: 10px;
padding-top: 0px;
padding-bottom: 0px;
.blue{
color: #09f
.right{
float: right;
.floatleft{
float: left;

What I see is that you put in a </div> after the "Product DVR 400 Series". That causes the next <div id="images"> with its larger width as well as no float: right causing it to position to the left margin.
If you were to add a float: right to your #images, it should bring the balance of the page back into alignment.
Also, your #maincontent has a width of 760px, but your #images has a width of 960px. I don't think it will hurt to keep it at 960.
Hope that helps.

Side bar issue

heyall, I would like to implement a simple side bar but for some reason when previewing it in the pane the, side bar is placed below the main column rather than the side of the main column. Can someone tell me what I am missing in the code? the html and css code is below
<body>
<div id="container1">
<div id="comp_menu">
    </div>
       <div id="comp_image">
       </div>
</div>
<div id="side_bar">
    <div id="inner_div">
    <p> </p>
    </div>
<div id="inner_div">
    <p> </p>
    </div>
<div id="inner_div">
    <p> </p>
    </div>
    <div id="inner_div">
    <p> </p>
    </div>
</div>
</body>
css code is here:
#side_bar {
height: 900px;
width: 200px;
    background: #FFF;
background-color:#FFF;
.inner_div{
height: 300px;
width:200px;
#container1 {
height:200px;
    width: 900px;
background: #FFF;
background-color:#FFF;

I don't think that is the correct set up Murray.
I think all that is required is to move the 'side_bar' <div> to within the 'container' <div> (according the the OPs requested).
You have it so the side_bar is sitting to the left of the container.
I believe this is the correct set up:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
#side_bar {
float: left;
width: 200px;
background: #FFF;
background-color:#FFF;
.inner_div{
height: 300px;
width:200px;
#container1 {
width: 900px;
background: #FFF;
background-color:#FFF;
overflow: hidden;
</style>
</head>
<body>
<div id="container1">
<div id="comp_menu">
</div>
<div id="comp_image">
</div>
<div id="side_bar">
<div class="inner_div">
<p> </p>
</div>
<div class="inner_div">
<p> </p>
</div>
<div class="inner_div">
<p> </p>
</div>
<div class="inner_div">
<p> </p>
</div>
</div>
</div>
</body>
</html>

Side Bar Appears On Top

When I try to open any new html page my side bar appears on
top on my screen. When I view in a browser it's all right. See
below: The side bar used to appear on the left as a column now it
just appears as main content across the page.
Header
sidebar1 Content
The background color on this div will only show for the
length of the content. If you'd like a dividing line instead, place
a border on the left side of the #mainContent div if the
#mainContent div will always contain more content than the
#sidebar1 div.
Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu,
pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi,
eleifend sollicitudin, molestie id, varius et, nibh. Donec nec
libero.
Main Content
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Praesent aliquam, justo convallis luctus rutrum, erat nulla
fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus,
fermentum id, molestie in, commodo porttitor, felis. Nam blandit
quam ut lacus. Quisque ornare risus quis ligula. Phasellus
tristique purus a augue condimentum adipiscing. Aenean sagittis.
Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,
odio. Donec et ipsum et sapien vehicula nonummy. Suspendisse
potenti. Fusce varius urna id quam. Sed neque mi, varius eget,
tincidunt nec, suscipit id, libero. In eget purus. Vestibulum ut
nisl. Donec eu mi sed turpis feugiat feugiat. Integer turpis arcu,
pellentesque eget, cursus et, fermentum ut, sapien. Fusce metus mi,
eleifend sollicitudin, molestie id, varius et, nibh. Donec nec
libero.
H2 level heading
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Praesent aliquam, justo convallis luctus rutrum, erat nulla
fermentum diam, at nonummy quam ante ac quam. Maecenas urna purus,
fermentum id, molestie in, commodo porttitor, felis. Nam blandit
quam ut lacus. Quisque ornare risus quis ligula. Phasellus
tristique purus a augue condimentum adipiscing. Aenean sagittis.
Etiam leo pede, rhoncus venenatis, tristique in, vulputate at,
odio.
Footer

See:
* Firefox > Preferences > Advanced > General : Accessibility : [ ] "Warn me when web sites try to redirect or reload the page"
For other OS see:
* [http://kb.mozillazine.org/Menu_differences Windows: Firefox (Tools) > Options - Mac: Firefox > Preferences - Linux: Edit > Preferences]
* https://support.mozilla.com/kb/Options+window+-+Advanced+panel#General_tab
See also:
* http://kb.mozillazine.org/accessibility.blockautorefresh

How do I get black side bars on a full screen photo in iPhoto 11

How do I get black side bars on a full screen photo in iPhoto 11. It was black in iPhoto 09 and now it's a murky grey. I'm not talking about events or photo view where it's in preferences only full screen photo. Thanks

Go into iPhoto's Appearance preference pane and move the Background slider all the way to the left - black.
OT

ITunes 12-Please please restore side bar functions for playlists -and how can i tell when and if it is safe to "eject" devices after synching

ITUNES 12-4points
1) Please restore the easy function whereby the side bar easily accommodates playlists
2) How do i know when devices can be ejected following synch--no visible drop down ?
3) How can i change the fonts and font sizes of the library-over and above the noddy large/small toggle in preferences
4) Look forward to a proper Apple update which includes full functions of iTunes radio. Hurry up with the latter-Spotify is overtaking you guys!

How do i know when devices can be ejected following synch--no visible drop down ?
I can only tell you based on what I see w/ my iPhone...
When I plug in my iPhone I get the following icon on the top bar:
If I click on that (that's when it turns blue), I get a sidebar. At the top I see this while it is syncing:
The circle-arrows spin. Once the sync is finished, I see this:
I then know the sync is over and I click on the Eject icon that replaced the circle-arrows.
Are you seeing something different?

Why most of the pages of my site are named "About me" if none have that name in the side bar nor in the inspector?

Here is my site for you to see what I am talking about; http://www.minkstereo.com after you enter, if you go to each of the menus you will notice that only Books and Ilustrations is named correctly in the tab, if you go to Drawings, Graphic Design, Crafts or any of the images you'll see that the page name is "About me" I have republished and check all over the page in iweb and I don't know why it is happening. Each page has a different name in accordance with the content both in the side bar and in the inspector it shows.
Any help is appreciated thank you.

Your images shows how to change the pagename, the filename. of the page.
Not the browser title.
Anyway, there is a textbox out of view that holds the title :
Beats me what it is doing there, but here is the oft repeated explanation :
iWeb uses the textbox in the Header layer of an iWeb page as the title in the browserwindow.
If the textbox in the Header is missing, iWeb uses a textbox down the page in the Content layer. If that textbox is also missing, it uses another textbox. If that fails it uses the pagename in the Sidebar. To replace a missing textbox in the Header, choose another theme and then change it back to the original one.
Sometimes you may want a different text in the titlebar and not display it on the page itself. Or not display it at all.
So use that textbox in the Header layer. Type your text. Do Command-T to open the font palette and make the font smaller (Or do Command--(minus)). Then select the textbox. In the Inspector choose T, click a color to open the color palette and drag the opacity slider to 0 (zero).
Resize the textbox. You may want to change the height of the Header layer.
Do Command-Shift-B to move the textbox to the back, possibly behind other objects.
Next add a optional second textbox to the Header layer and use that one to display text on the page.
If you want to move the textbox to the front again to make changes, but can't remember the location on the page, drag the area with the mouse to select the objects.
Deselect objects you do not want to move forward by Command-dragging the mouse over these objects.
Next do Command-Shift-F to move the textbox to the front. Repeat the steps in reverse order to make the text visible.
Source : http://www.wyodor.net/htmlegg/TallCard/TallAjax.html?pg=BrowserWindowTitle

How to change the color background in Pages for iPad?

how to change the color background in Pages for iPad?

You can find many themes at https://github.com/hdoria/xcode-themes There's a download zip button on the right side of the page.
Unzip and and copy the .dvtcolortheme files into /Users/YourUsername/Library/Developer/XCode/UserData/FontAndColorThemes Create the directory if it doesn't exist.
If you can't find the Library directory you can get to it by using Finder's "Go to Folder..." option under "Go" or press shift + cmd + G then type the path.

How can I have the side bar in iTunes 12??

I just installed iTunes 12 that was claimed to provide "a more pleasant interface for navigation"!?!?
Personally, I do not find the new view format pleasant at all. I expected to be allowed to go back to the lateral bar visualization, finding it as a view option. It was quite upsetting finding out that the option disappeared from the menue. Did you have the brilliant idea to remove it, or did you simply hide it somewhere else? (I am definitely too old to play "hide and seek" with visualization options and I really do not have the time either)
Probably, kids like big figures that do not require any reading skill, unfortunately I do not.
I conclusion, how can I have the side bar visible again in iTunes 12???
Thank you
P.S. Playlists is similar to lateral bar, but not the same, as it is not ONE allowing to navigate music, movies, podacast, but one for each.

The functionality of the sidebar has changed indeed. But what's the problem? Category's of the library have been separated from playlists and moved to one of the top bars. I think it's an improvement for people using iTunes as a media-management tool. In the old version the playlists were at the bottom of the sidebar and if you had all options activated you had to scroll down to find your playlists.
You don't have to do that anymore. Your music library is now aside with the playlists. If you want to activate another categorie you can use the icons in the topbar and still keep the overview on your playlists.
People who use iTunes for syncing iDevices seem less happy with this new presentation. It seems a minor adjustment to me, but others seems to think otherwise.

Color Background in Side Bar Navigation Include

Similar Messages

Maybe you are looking for