Jump to content
Sign in to follow this  
Lisa Haran

Padding in header

Recommended Posts

Lisa Haran

Hi I have all the posts re this problem and have tried every solution but I still have padding in my header. My test site is located at http://www.kinlaydublin.ie/newsite/hostel/ I have a text widget in the header as I wanted to add my own graphic menu to the site so this was my way around it. I have trawled through the css and have remove all padding. Have the following implemented, but still have the padding. Please help. body #page .content-pad {margin: 0px;padding: 0px;} .content-pad {margin: 0px; padding: 0px;} #branding .content-pad{padding: 0px;margin: 0px;}

Share this post


Link to post
Share on other sites
Andrew

What's the padding you're trying to remove?. you have a lot going on there, that isn't done by 'best practice' e.g. using a sidebar and inline CSS. So its a little hard to see what's going on. On the other hand, its looking nice!

Share this post


Link to post
Share on other sites
Lisa Haran

Hi Andrew thanks for your reply, I needed a graphic based and linked menu in the header and this was the only solution I could fine to include this. My problem was I needed to push the header to the top of the page. But I put body #branding .content-pad { margin-top= -13px; } into the Custom CSS, and this now works. Can you tell me if I wanted to add a background image to the sidebar or to individual widgets is this possible thorough Custom CSS?

Share this post


Link to post
Share on other sites
Kate

Hi Bren - Yes, that's possible... If you need assistance with it, let us know.

Share this post


Link to post
Share on other sites
Lisa Haran

Hi Kate, Having real problems with my customised header. When I embedded my hard coded html and css into a text widget on the uninversal sidebar widget, and then popped the universal sidebar into the "site header" template set-up it worked in firefox only. So back to the drawing board, can you advise me on the best practice for implementing a custom header as I do not require anything in the header apart from my code which I will put online into a standard html file so you can see it seperatley. I know it's probably unusual not to have a HTML top level navigation but this is what my client required. I'll submit the link the header.html is a few minutes. Thank you for your time

Share this post


Link to post
Share on other sites
Lisa Haran

Hi Kate The link for my header is here http://www.kinlaydublin.ie/newsite/index.html as you can see I have a bkg for text widget book now which also does not appear. I did a W?? validator on the site and is states an error with Line 54, Column 123: Element style is missing required attribute scoped. ??¦fix"><div class="widget-pad"> <div class="textwidget"><style type="text/css"> Attributes for element style: Global attributes media type scoped Also, the title attribute has special semantics on this element.

Share this post


Link to post
Share on other sites
Lisa Haran

Hi kate, would you believe just after I sent the second email I got it working, basically I have my css file in the root and not in the themes folder and it now works in all browsers. I also removed a lot of the bad coding I had in the widget so it is validated. So can I ask you how to add the a background behind the sub nav widget.

Share this post


Link to post
Share on other sites
cmunns

Looks like the id for that widget is wenderhostsubpages-3 so you would use CSS like this `#wenderhostsubpages-3 {background:url('/image.png') no-repeat;}`

Share this post


Link to post
Share on other sites
Lisa Haran

great stuff that worked a treat, odd I had thought of that yesterday and tried it and it didn't work!! Thanks I also am trying to establish the best method to create a background image behind the body content area. See http://www.kinlaydublin.ie/newsite/hostel/ To explain, currently I have hard coded the style in rather than creating a box with the style linked to it so when a user types the content they don't have to be concerned whether or not the <div> is closed. this is the HTML, is there a better practice to create a ONE row/column box with a style linked to it? <h1>The Hostel</h1> <h2>We pride ourselves on our friendly service</h2> <h3>What we offer</h3> <div id ="topcontent" > TV Lounge Watch DVDs, TV (on our 42" plasma screen), surf the web or just hang out! Bicycle rental Rent bikes and explore Dublin for only ?‚¬12.50 per day Fully equipped kitchen Eating in is the new eating out. Cook up a storm in our fully equipped self catering kitchen Free International Calls Free international calls to landlines from our skype phone. Security lockers laptop safes For storing your valuables .?‚¬1 per day </div>

Share this post


Link to post
Share on other sites
Lisa Haran

How can I get my "book now" to overlay slightly on the header, it seems to appear UNDER the header when I add - margin value #booknow {(margin: -20px 0px 0px;)} I tried z index but that didn't work. http://www.kinlaydublin.ie/newsite/hostel/ HTML example here with same -20 margin here and it works, http://www.kinlaydublin.ie/newsite/index_embeddedcss.html

Share this post


Link to post
Share on other sites
bryan-hadaway

- Background image: http://www.pagelines.com/forum/topic.php?id=5721 - Custom boxes/divs methods: http://www.pagelines.com/forum/topic.php?id=5643#post-30768 - "Book Now": ` #booknow { background: url("http://www.kinlaydublin.ie/newsite/img/book_now_container.png") repeat scroll 0 0 transparent; height: 213px; left: 620px; position: relative; top: -510px; width: 302px; } ` Is this what you wanted? If not, just change top and left to position it where you want. Thanks, Bryan

Share this post


Link to post
Share on other sites
Lisa Haran

hi bryan had a look at your tutorial on custom boxes and that is what I have set up, but I wanted to know if there was other method of assigning the div class to a custom box apart from pasting the div HTML code into HTML area of the post content apart. The reason I ask if my client is not tech savy and when he goes to update a page/post he won't be using the HTML tab more like the visual tab and he will just type directly. My concern is that he will delete the <div id ="topcontent" ></div> that i have in the html. tried your book now css it totally disappeared, thanks for your help though, I'll look at the other tutorial now

Share this post


Link to post
Share on other sites
cmunns

For the book now problem it's simple...some of the CSS is set to overflow:hidden so... ` #sidebar1, #sidebar2 { overflow: visible; } ` ` .widget { overflow; visible; } ` With the other issue have you considered using a highlight section or maybe create a shortcode to make it easy for him to add back in if he erases on accident?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×