Stop header description from shifting when zooming in

[benconnor]

Hi guys,

Struggling to get my head around this problem. Have tried all manner of things.

With my website, on smart phones the header description text shifts to create two lines when I zoom in close – doesn’t do this on desktops cause i put in a #MainWrapper (for some reason smart phones don’t recognise this).

Is there anyway of stopping it from doing this? A simple CSS command perhaps?

I just want it to stay as one line and get cut off by the side of the screen if zooming in requires this.

Here is my website: http://benconnormusic.com/

Cheers,

Ben

 

[bwboykin]

Hey Ben,

Looks like the theme you are using 'News' is not responsive so minus the media query stylings you get already set up in the last 19-20+ themes StudioPress has offered up you'll more than likely have to add that into your CSS in order to achieve the desired outcome. With their responsive themes you can pretty easily drill down and customize elements in each's stylesheet like you have reference in order to show like you want on phones and tablets in both portrait and landscape mode.

 

[Ozzy]

if you're not worried about responsive and just want to fix that issue, you could try going into your style.css, searching for #title-area and putting

white-space: nowrap;

into the styling of #title-area

I don't know if that will fix your problem, but i hope it helps!

---

Ozzy Rodriguez | Twitter | Google+

[bwboykin]

Ozzy's suggestion FTW! Proof that two heads are better than one : )

[benconnor]

Ha ha ha,

I had responsive design bwboykin, but being far less tech savvy than someone like yourself, I didn't find it easy to customise at all. Also want the mobile version to pretty much replicate the desktop, so getting rid of responsive design worked a treat.

Ozzy!!! Once again, thank you man. Problem solved 🙂

Cheers,

Ben

[Author]

Posts