How to get the image on the right place?

Hello,

how can i get my header and menu on the right place , please look at the image ,  and i have also upload the files


Thank you.
html.zip
remove.gif
kensy11Asked:
Who is Participating?
 
NrisimhaCommented:


Or try to resize image samenco.gif:

 New samenco.gif
or correct #TemplateMenu into:


#TemplateMenu
{
      text-align:center;
      background-color: #45AAFF;
      padding: 0px 40px 0px 40px;
}


Nrisimha
0
 
COBOLdinosaurCommented:
The position is correct based on what I can see because the underlying width includes the width of the borders and shadows.

Try adding left and right padding to the top image container.

Then if you still need help, post a link to the page; I'm not going to dig through a 520k zip file.



Cd&
0
 
AlexSoftware EngineerCommented:
Maybe you have to increase the master div that includes all the content or to decrease the menu and image width.
 I don't  see something so hard to modify it. Just modify elements' width.
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
AlexSoftware EngineerCommented:
...and of course image's width or any other graphic that you want to restrict.
0
 
NrisimhaCommented:


Look, in a  StylesheetStructuur.css you have this style for #TemplateHeader although the image bg_header.gif has dimensions 1024x105 pixels:

#TemplateHeader
{
      height: 85px;
      padding: 20px 40px 0px 40px;
      background-image: url(images/bg_header.gif);
      line-height: 85px;
      font-size:14px;
      font-weight:bold;
      margin:0;

Then you SHRINK this image with padding: 20px 40px 0px 40px; .
That means that your right and left padding is 40+40=80 pixels !!!
So, the image will be resized to 944x105 pixels !

And your samenco.gif file that has 1024x768 pixels has width=1024 and is not shrinked to width of 944 pixels:

#TemplateMenu
{
      text-align:center;
      background-color: #45AAFF;

}

Here you have the width 1024 pixels !!!
But in all those CSS styles you have a shrinked images. Lok at #Template-inhoud:

#Template-inhoud {
      width:1024px;
      background-image: url(images/bg_inhoud.gif);
      background-repeat: no-repeat;
      padding: 20px 40px 0px 40px;
      margin: 0 0 0 0;
      height: 280px;
}

Here you have also 40+40=80 pixels padding and shrinking.
The image bg_inhoud.gif has dimension 1024x280 pixels, but the padding is 40 right and 40 left and the image is shrinked to 944x280 pixels.

You have to correct this and everithing will be OK.


Nrisimha

0
 
NrisimhaCommented:

Regards kensy11,

I would like to know did you try my solutions for your problem and does it works for you?

regards

Nrisimha
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.