Post by giproc » Wed Sep 07, 2016 11:25 pm

Greetings,

I'm trying to center the Logo in the header for OC 2.1.0.2 By doing a couple of easy tweaks in the header.tpl file, it works perfectly in OC 2.0.3.1 but the same mod won't work in OC 2.1.0.2.

First I changed the header container to show just the LOGO on the row instead of LOGO / SEARCH / CART and then I add the [ style="text-align:center;" ] inside the <div id="logo" > line like this…..

<div class="container">
<div class="row">

<div class="col-sm-12">
<div id="logo" style="text-align:center;">
……….
regular unchanged logo display code is in here
…………
</div>
</div>


</div>
</div>

It works perfect on OC 2.0.3.1 but it won't center the logo on OC 2.1.0.2 even though the original code in the two header.tpl files for this section of output in OC 2.0.3.1 and 2.1.0.2 are identical.

Then I tried to creat a new div and wrap the logo code in it........

<div class="container">
<div class="row">

<div class="col-sm-12">
<div style="text-align:center;">
<div id="logo" >
……….
regular unchanged logo display code is in here
…………
</div>
</div>
</div>

</div>
</div>

No luck with this one either in 2.1.0.2 even though ti works in 2.0.3.1.

Question then, is there some code somewhere else other than header.tpl that might stop the logo from not centering (both in desktop and mobile mode) in version OC 2.1.0.2 ?

http://altsur.com

Any ideas would be greatly appreciated.

New member

Posts

Joined
Sat Aug 29, 2015 9:24 pm

Post by cyclops12 » Thu Sep 08, 2016 12:17 am

You could try this..

Code: Select all

<div class="col-sm-12">
       <center>
        <div id="logo">
                    <a href="http://altsur.com/"><img src="http://altsur.com/image/catalog/altsurbig2-23.png" title="AltSur Gallery" alt="AltSur Gallery" class="img-responsive"></a></div></center>
                  </div>

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by cyclops12 » Thu Sep 08, 2016 12:20 am

Or even add this

Code: Select all

    text-align: -webkit-center;
to #logo in your stylesheet so it looks like this

Code: Select all

#logo {
    margin: 0 0 10px 0;
    text-align: -webkit-center;
}
Or just replace your <div style="text-align:center;"> with <div style="text-align:-webkit-center;">

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by giproc » Thu Sep 08, 2016 1:15 am

Many thanks Cyclops12 !!!

<Center> worked perfectly!

Cheers.

New member

Posts

Joined
Sat Aug 29, 2015 9:24 pm

Post by cyclops12 » Thu Sep 08, 2016 1:33 am

Glad it worked out for you and happy to be of help

Expert Member

Posts

Joined
Sun Sep 27, 2015 1:10 am
Who is online

Users browsing this forum: No registered users and 7 guests