Mar 16, 2009

Under construction

I had a mate make a nice header image for me to use on the blog, thanks a bunch Rhuk it looks great :)

Now then, as you'll see, something looks very off about the title.. I've looked inside out on all the layout options i can find for the blog, but surely there must be some way to have the picture centered, instead of automatically left aligned ?

Preferably without nuking the entire layout for a new one? Halp!

Edit: I r pro html haxor and found it finally!
Edit #2: I r noob. Seems title is centered on IE, but left aligned on Firefox3. Argh!

Edit #3: Lisandra to the rescue! Can't check on Opera/Firefox atm but it looks like its fixed now ?

13 comments:

Anonymous said...

Left aligned in Opera as well :)

Vads said...

I'm utterly stumped now. Any idea how to fix this? Looks like it needs artful editing in the blogspot templates htlm..

And I am like uh, internet-challenged.

Lisandra said...

Add
margin-left: auto;
margin-right: auto;
to the CSS for the image itself (not the header-wrapper or the header-whatever part). Centers the image in FF, didn't test in IE though.

Vads said...

Ooh thanks Lis! I added that in the template html just hope I put it in the right place. :)

Page still works at least, cant check how it looks on FF here from work though, fingers crossed.

Lisandra said...

Nah, still not working - but I do not see where you changed the code anyway ;)
The id of the image is "Header1_headerimg", so in the stylesheet you should have added a section like

.Header1_headerimg
{
margin-left: auto;
margin-right: auto;
}

or, alternatively directly in the code for the image, where it currently says
style="display: block;"
to read
style=display:block;margin-left:auto;margin-right: auto;"

Can't tell you the source code line though, since I have no idea how that Blogger template works...

Lisandra said...

Err, not
.Header1_headerimg
but
#Header1_headerimg

Vads said...

The first thing you suggested there didnt work for me at all, I just got a line on top of the title image with the text "header1_headerimg" etcetc.

But far down in the template there was a header line with the style:block word and I tried to paste in the 2nd suggestion there. It saves and loads ok, wonder if that's done the trick ?

Lisandra said...

Yup, looks good now on Firefox :)

Vads said...

Thanks a bunch !

Anonymous said...

Uhm.. looks utterly ... RIGHT-aligned on Safari (Mac). *grins*

Anonymous said...

Seems perfect center-aligned on Safari 4 beta.

Lisandra said...

As Rhukhol said: looks centered on Firefox 3, Google Chrome Beta 2, and Internet Explorer 7, and Safari 4 Beta hier under Windows XP. Can test on Vista / IE8 at home later or tomorrow ;)

Vads said...

You're not just pulling my leg now Esh babe? Blah, browser compability is a challenge it seems.

I just installed IE8 on the work computer and it looks fine on this as well :)

Thanks for all the help Lisandra with this and again Rhukhol for making header of awesomeness :)