-1

I am trying to add a 4 pixel bottom border to the header of a ThemeRoller Mobile template. I see the option for setting a border color but it just applies the border all around. Is there a way inside of ThemeRoller to set it to bottom only and set the width, or can anybody provide the proper place inside the css file to adjust this? Thanks in advance!

Edit: I tried changing the .ui-bar-a class in the css file from border: to border-bottom: and chaing the pixel width, but the changes do not show up when the file is rendered in chrome. But if I change it in the web inspector, the changes do work and I can get a 4 pixel bottom border on that element.

Russell Christensen
  • 191
  • 1
  • 12

2 Answers2

1

Try this:

ui-header {
     border-bottom:4px solid #000;
}

You can put this in your own css file to keep thing clean and organized. But remember, when defining all your css files in your head section. Make sure to FIRST load the jquerymobile css file and after that your css file. This is because now your css declarations will overwrite the jquerymobile declarations. 

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile.structure-1.2.0.min.css" /> 
<link rel="stylesheet" href="your-css-file.css" />
Angelo A
  • 2,744
  • 6
  • 28
  • 37
  • Thanks, adding that to the CSS works. Also I found part of my problem in my edit section is I was making the changes in the regular css, the page was linking the minified, obviously the changes don't happen automatically. It would be nice to find a way to do this using the steamroller UI so I wouldn't have to edit the min manually. The change can be made either in the ui-header or ui-bar-a css. – Russell Christensen Oct 24 '12 at 14:01
  • True. But you shouldn't touch the minified css file. Just use your own CSS file and overwrite the jQueryMobile declarations. – Angelo A Oct 24 '12 at 14:03
1

Try this

$(".ui-header").css("border-bottom", "4px solid #000000");

just put it on the page you want the border changed, or js file that contains it

Jeandre Pentz
  • 992
  • 2
  • 9
  • 20