0

I have Joomla 3.7. I have replaced the file personal2.png in /templates/beez3/images/personal/personal2.png to another image with the same resolution ( 1060X288 ).

The Image Logo changed but the image isn't fit, I mean the Image is with another size (more bigger).

I want to inherit the default CSS and I want the image to fit to the logo header size and to be resized when the screen browser is smaller ( because when I smaller the windows the image is not showing very well and

I lost some of it. ( I mean I want it responsive to the size of the window ).
I would appreciate any help. Thanks

|improve this question
  • 1
    Can you give us a link to the website to inspect? – FFrewin♦ Jun 30 '17 at 23:25
  • I didn't uploaded it right yet but it's an regular Joomla I doesn't change it. I just changed the image of the header ( personal2.png ) with another image with the same resolution but it doesn't showing very well – Ayman Ghandour Jun 30 '17 at 23:33
  • the "doesn't show very well" is too vague to describe the issue you have - it will hard to help you without further info or better without seeing this... FYI I just did the same and replaced the personal2 file with another same size one and don't see any problems. – FFrewin♦ Jul 1 '17 at 7:49
  • It's a regular beez3 template... maybe you have another template because I uninstall Joomla and install it again and I have the same problem I am sure I am doing nothing wrong. – Ayman Ghandour Jul 3 '17 at 7:10
2

No, I don't have another template - I know what I 'm talking about and this is about the Beez that comes with Joomla 3.

I replaced the image with another of the same size and it's not looking bigger or isn't fitting. I am getting the exact same behavior as if I was using the personal image.

The description of your problem is rather vague for us to understand what the actual problem is. Maybe what you are trying to do is not going to work.

A few things to note about Beez:

Beez actually has a certain way of dealing with the header image in its css - that positions the background image to top-right.

It doesn't provide css that will resize the background image on window resizing, - not exactly what you would call "responsive" at this element.

Also another thing to note is that the personal.png background image has bigger height than the actual header area height that it covers.

To be frank, using the Beez template / personal style and try to replace it's background image for the header, it is not the most easier/user-friendly thing for a beginner user, as it requires from someone to understand how its css works, or just simply use a header image that is going to work in the exact same way as the default one -and this is not only about using the exact image size.

Set back again the original image and study how it behaves.

|improve this answer

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.