Welcome! To use this support forum, please Login or Join Today!

   

Make Header Extra display when viewing on mobile

{name}
Rank

Total Posts: 10

Joined 2014-11-09

PM

 

I have a separate image for the mobile version of the site. And it’s kicking out my header extra when I view on any mobile device. I need the phone number to display on mobile as a click-able link.

Site: http://www.granitestatespecialties.com/

Thanks,

{name}
RankRankRankRank

Total Posts: 3667

Joined 2011-04-27

PM

 

It looks like you have the phone number hardcoded in the mobile image no?

Removing this from the CSS will bring the text-widget phone number back into view:

/* Header Extras Widget */
#header .header_extras {
  
top85px;
  
right550px;
  
width300px;

 

{name}
Rank

Total Posts: 10

Joined 2014-11-09

PM

 

I had that there so the number would show up in a different location for desktop view. It’s ok though I’m going to keep it on the top right of the header.

One more thing. I can’t seem to get the city sky-line to line up with my nav bar. I want no space. And the “G” in my logo is getting cut off on the left and I can’t seem to figure out why.

Thanks again,

Anthony

{name}
RankRankRankRank

Total Posts: 3667

Joined 2011-04-27

PM

 

The G is cutoff in the logo because it’s actually cropped in the image itself.
http://cl.ly/image/132B0M0E2d1P


As for the positioning, just add the bottom left; positioning to the element.

#header #site-title.graphic a {
  
background-positionbottom left;