I have been tampering around with the banner (fonts, pictures etc) on my blog. What I noticed however was that depending on the Browser one was using the text would appear differently. I wrote about it here.
I decided to use an image as a banner instead and tried to insert it into the Blogger template (this is mostly by trial error - I am no blog genius here LOL!). It did not really work the way I expected and as common sense would have it. I got a very helpful friend to try and help me out too. She was able to get it up but some parts were cut off or squished. I would really appreciate some step by step instruction to this as I am not 100% familar with HTML or CSS. If anyone knows of a website or has tackled this issue with their own Blogger blog I would really appreciate it big time.
PS. I did look at previous posts if this issue was addressed in the past but was unable to find something. So if I missed it please forgive me.
This Post was written by MEETA from What's For Lunch, Honey?
Subscribe to:
Post Comments (Atom)
10 comments:
Hi Meeta,
It looks fine to me.
Me too Meeta in Firefox
Fine in Firefox- I think :)
The difference seen between Firefox and IE can be quite disturbing at first, esp if one wants to be very controlling about how their website displays.
I encourage everyone to check out their site in different browsers. Relinquishing extremem control over how my site looks was a tough one for me to learn... it may not be for everyone.
The scrunching/cutting off of your banner that you discribed can often happen when you have a conflict between your inserted image size and the fixed width/size of your banner space as defined by your css.
AFWIW- trial and error is an excellent way to learn. Just make sure you have a test blog set up for only playing with template changes :)
A tutorial way to learn css that I recommend is at W3 schools.
Sorry! I think I migt have formulated my query a little ambiguosly. The current banner you see on my blog is the old/current one that I intitially played around with. This one looks fine. But the one I actually would like to put up - my image - was not looking too good that is why I took it off.
I was hoping I could get instructions to be able to get it up looking good!
Maybe if you put the faulty banner up and include a post with the page source info folks can look at it and make suggestions. Otherwise it's kinda tough to figure out what's wrong.
Meeta- make a test blog for testing your template. Put the questionable banner in there and give us the test blog url.
OK! I've created a test site and here it is:
http://meetastestsite.blogspot.com/
You see that I am having trouble with the transparency too! The blog banner with the Title "Testing" is coming through and my actual image does not look very much like this:
Image
On the blog it is a bit squished and the borders look strange.
Can you help?
The banner is cut off because your #content box is too small. Try increasing it to 780px.
Then, your #header div will need a little padding on the top-
#header div {
padding:55px 0px;
margin: 0;
}
Then, to make your blog title disappear, you can change the transperency, but it's easiest to just but a " visibility: hidden;" in your #blog-title style.
AHHH! Paul, it seems to be working!!! It's not perfect but I think I am beginning to understand what I am supposed to do. The rest is trial and error. Was wondering if I needed your help again may I write to you personally?
All of you have been helpful with your tips and tricks. I am always amated at how brilliantly you all help one in distress.
Right I have fiddled around with it a bit. And my trouble now is that I see it Firefox and Safari but I have no banner on IE!
http://meetastestsite.blogspot.com/
It was too good to be true! I cannot say it enough - I hate IE!!
Post a Comment