7 replies to this topic

[WarriorII]

Hi, I have a problem with the Branding Logo on this website. On most browsers (Safari, Chrome, Opera) looks centered, but in Firefox looks way out to the right. I'm using PageLines Framework 2.2.5 and this is my custom CSS related with the header:

Please Login or Register to see this Hidden Content

[catrina]

The branding image appears to be moved out of the branding wrap container and it may have to do with the branding image being implemented with javascript. You can try using the browser-specific plugin to come up with CSS that allows you to move that image specifically on Firefox:

Please Login or Register to see this Hidden Content

[WarriorII]

Thanks Catrina, I installed the plug-in. How can I implement it? could you please give an example?

[WarriorII]

I tried this:

Please Login or Register to see this Hidden Content

[catrina]

Sorry, I forgot to include the link on how to use the plugin:

Please Login or Register to see this Hidden Content

Here's an example of the CSS you'd use to adjust the position of the branding image (added to Custom Code > Custom CSS):

Please Login or Register to see this Hidden Content

Adjust the number of pixels until the positioning is just right.

[WarriorII]

Thanks

[DIYPropertyManager]

Not trying to hijack this thread, but since the 'symptoms' are the same, I figured I would just add to this one.

 

 

I too have been having a similar issue with FF.  My problem stems from the "recommended" way of adding Google Adsense into the branding section above the mainlogo-img.  

 

pagelines-customize/functions.php

 

 

add_action('pagelines_inside_top_branding', 'google_leaderboard_ad');

// function name

function google_leaderboard_ad(){

?>

<div class="leaderboard">

<script type="text/javascript">

    google_ad_client = "ca-pub-4654815947711460";

        /* Leaderboard */

google_ad_slot = "8176564403";

google_ad_width = 728;

google_ad_height = 90;

//-->

 

</script>

<script type="text/javascript" 

 src="

Please Login or Register to see this Hidden Content

">

</script>

</div>

<?php } ?>

 

 

Without any CSS, this advertisement is left justified in IE, Chrome, FF, and Safari.  I then scoured the Pagelines forums again and came across some recommended CSS for this.

 

 

#branding .leaderboard {

        float: left;

  margin: 5px 2% 0 0;

  padding: 0 11%;

        z-index: 10;

        position: relative;

}

 

 

Now with the addition of this CSS, most desktop browsers behave as expected except for FF.

 

IE: Everything looks correct

Chrome: Everything looks correct:

Safari: Everything looks correct

FF: Advertisement is centered correctly, but my logo is way out in right field.

 

 

So I would assume that everything could be fixed by CSS, but I am a little lost on how to proceed.

 

[James B]

Hi there

 

If you install the browser specific css plugin you'll be able to target the css for firefox in particular.

Please Login or Register to see this Hidden Content

 

Then you can use the .firefox command before your current css and change the figures to suit the display in firefox.

 

 

Please Login or Register to see this Hidden Content