CSS questions- height of content area & colour change of fixed nav bar

[obscura 0]

A couple of questions, that i would be most grateful if someone could answer?....... 1) can anyone tell me what CSS controls colours of the fixed bar navigation bar? I added this to the pagelines-customize/style.css but it only seems to affect Firefox. Safari and Chrome are unaffected.- .pl-color-grey { background: -moz-linear-gradient(center top , #FFFFFF 0%, #FFFFFF 0%) repeat scroll 0 0 transparent; } .navbar.pl-color-grey { border-top: 1px solid #FFFFFF; color: rgba(0, 0, 0, 0); } 2) what CSS controls the distance between the main content area and the navigation. It seems to be inconsistant. If you view this example i have made a page with a feature section. See how the top of the feature section aligns with the right Sidebar. - http://obscuraphotos.com/a/sample/ Then view this example - http://obscuraphotos.com/a/photographers/andrea-francolini/ This is just an image posted to the top of the page but the height doesnt align like that of pages that display Sections at the top of the page. I would like to change the CSS so that the content is the same height at Sections that are displayed. Any help i would greatly appreciate! cheers Glenn

[Danny+ 1,327]

Hi Glenn, 1. The code below controls the navbar background color, link color and hover color.

.navbar { background: red; }
	.navbar .navline > li > a { color: white; }
	.navbar .navline > li > a:hover, .navbar li.current-menu-item > a { color: green; }

2. This is either margin or padding that is causing this. .post-meta { margin-bottom: 0; } I highly recommend, you start using Firebug or Google's Web dev tools. It allows you to inspect your websites CSS.

[obscura 0]

Thanks for that. Really appreciate it. I have Firebug but am still getting my head around it. I have another page with a flash swf file installed via the Kimilli plugin and it has the same problem with it not lining up after the change in CSS? Any ideas? eg. - http://obscuraphotos.com/a/photographers/brodie-standen-2/

[catrina 103]

What CSS are you using to make the change? Do you mean lining up at the top with the social icons?

[obscura 0]

Hi Catrina, yes i mean lining the .swf file up with the social icons to the right. I added this CSS .post-meta { margin-bottom: 0; } which moved images and text inline with the icons but it hasn't worked on the .swf file?

[obscura 0]

This is the CSS for the plugin, not sure if the issue is in here or not? #KFE_Generator { padding: 0 13px; } .wrap { width: 640px; } fieldset { border: 1px solid #ccc; padding: 10px; } .col1, .col2, .col3, .col4, .col5 { float: left; display: inline; } .col1 { white-space: nowrap; width: 140px; } .col2 { width: 450px; } .col3 { width: 100px; } .col4 { width: 130px; } .col5 { width: 350px; } .help, .clear { clear: left; } div.clear { height: 1px; } #alternativeContent, #output { width: 590px; } #publishingMethodHelp, #alternativeContentHelp, #replaceIdHelp, #toggleReplaceId, #isIdReq, #toggleAttsParamsContainer { display: none; } * { font-size: 12px; line-height: 21px; } textarea { font-family: Courier, monospace; line-height: 14px; } div { vertical-align: text-bottom; } fieldset { margin: 6px 0; } input { line-height: normal; } input#replaceId { width: 50%; margin-right: 6px; } input[type=text], select, textarea { width: 90%; } .col2 textarea, .col2 input, .col5 input { width: 100%; } input#width, input#height, input#major, input#minor, input#release, select#publishingMethod, select#unit { width: auto; } h1 { font-size: 18px; } a { color: blue; } .info { border-bottom: 1px dotted #666; cursor: help; } .req { color: red; } .note { font-size: 10px; color: #666; } .help { margin: 0 0 10px; padding: 10px 10px 0; border: 1px solid #ccc; background-color: #ffc; } .help h2, .help h3, .help p, .help ul, .help li { margin: 0; font-size: 11px; line-height: 14px; } .help h2, .help p, .help ul { padding-bottom: 10px; } .help h3 { color: #666; }

[obscura 0]

It seems to be in the embeded code- i have changed it to align="top" seems to be aligning properly now. [kml_flashembed publishmethod="static" fversion="8.0.0" movie="........................" width="1090" height="600" targetclass="flashmovie" align="top" quality="best" scale="exactfit" bgcolor="ffffff" allowfullscreen="true" base="."] [/kml_flashembed]

[obscura 0]

Not sure why it wont align properly when in the scale mode "showall'???

[obscura 0]

it was because of the scale dimensions of the .swf, duh!

[Danny+ 1,327]

Is you issue now resolved ?

[obscura 0]

yes thankyou