Author Topic: delete gaps between frames  (Read 4433 times)

Offline spiderpig2008

  • Posts: 10
delete gaps between frames
« on: May 19, 2012, 04:58:31 PM »
Hello guys,

I´m a beginner in programming websites with WB and I puzzled for a long time to design this Webite www.stb-fliege.eu .

No I have a problem which I can´t solve. I want to delete the white gaps arround the menu-frame that the header, the menu and the backround will be one unit.

I would be happy about some answers.

This is my .css


body,td,th {
   font-family: Times;
   font-size: 21px;
   color: #000;
}
body {
   background-color: #fffafa;
   background-image: url(images/background.jpg);
   background-repeat: repeat-x;
   margin: 0px;
}
a:link, a:visited, a:active {
   color: #000000;
   text-decoration: none;
}
a:hover {
   color: #000000;
   text-decoration: none;
}
hr {
   margin: 15px 0px 15px 0px;
   color: #000000;
   height: 1px;
   width: 100%;
}
h1 {
   font-size: 18px;
   color: #000000;
   margin: 5px 0px 5px 0px;
}
h2 {
   font-size: 15px;
   color: #000000;
   margin: 0px 0px 5px 0px;
}
form {
   margin: 0;
}
.header {
   width: 900px;
   height: 150px;
   text-align:left;
   background-color: #fffafa;
   vertical-align: top;
   margin: 0;
}
.menu {
   background-color: #FFCC00;
   position: left;
   width: 200px;
   margin:0;
}
.menu ul, .menu li{
   list-style-type: none;
   margin: 0;
   padding: 0;
}
.menu ul {
   border-bottom: 0px;
   background-color: #FFCC00;
}
.menu ul ul {
   padding-left: 0px;
}
.menu a:link, .menu a:visited, .menu a:active {
   padding: 10px 70px 10px 10px;
   color: #000000;
   display: block;
   background-color: #FFCC00;
   text-decoration: none;
}
.menu a:hover {
   background-color: #FFCC00;
   text-decoration: none;
}
.menu-current {
   font-weight: bold;
}
.highlight {
   background-color: #fffafa;
   margin: 0;
}
.border {
   font-size: 1px;
   height: 10px;
}
.login {
   position: relative;
   bottom: 150 px;
   left: 150 px;
   padding: 0px;
   font-size: 10px;
   background-color: #FFF;
   color: #000000;
   text-align: center;

}
.login input {
   width: 95%;
   font-size: 11px;
}
.login a:link {
   color: #000000;
   text-decoration: none;
}
.login a:hover {
   color: #FFF;
   text-decoration: none;
}
.powered_by {
   padding: 3px 0px 0px 15px;
   background-color: #FFF;
}
.content {
   padding: 10px;
   background-color: #FFF;
   height: 600px;
   vertical-align: top;
   text-align: left;
}

.footer {
    position:fixed;
    bottom:0px;
    left:80px;
    width:1000px;
    background:#fffafa;
    font-size: 11px;
    height:5%;
    text-align:right;
    padding-top:1%;


}
}

Offline dbs

  • Betatester
  • **
  • Posts: 8737
  • Gender: Male
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: delete gaps between frames
« Reply #1 on: May 19, 2012, 05:34:24 PM »
Hi and welcome,

plz use #-button for showing code.
In most cases the code is not needed, only the link to the problem.

For the menu: search this in the index.php of your template:
Code: [Select]
<td valign="top" style="background-color: rgb(255, 255, 255); padding: 10px;">and change to:
Code: [Select]
<td valign="top" style="background-color: rgb(255, 255, 255);">
But a free template, without tables, would be a better way for you.
There is also a big german community in this forum. ;-)



Offline spiderpig2008

  • Posts: 10
Re: delete gaps between frames
« Reply #2 on: May 19, 2012, 06:20:00 PM »
Thank you for the nice welcome!  :-)

Honestly I don´t want to change the template because I have invested a lot of work in it right now.

Thank you dbs for your solution. It works. The menu looks good so far but now I want to put the login-box on the left side and make the orange menu-frame a little bit smaler.






Offline dbs

  • Betatester
  • **
  • Posts: 8737
  • Gender: Male
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: delete gaps between frames
« Reply #3 on: May 19, 2012, 06:59:10 PM »
For width of menu, same line:
Code: [Select]
<td valign="top" style="background-color: #FFCC00;">change to
Code: [Select]
<td valign="top" style="background-color: #FFCC00; width: 200px;">
For login, find this in your template.css (line 64):
Code: [Select]
form {
    margin: 0;
}
and change to
Code: [Select]
form {
    margin: 0 0 0 20px;
}

Offline spiderpig2008

  • Posts: 10
Re: delete gaps between frames
« Reply #4 on: May 19, 2012, 07:33:57 PM »
I have displaced the LoginBox with this line in the .css
form {
   margin-right:100px;


But the code for the index.php hasn´t solved the problem with the large menuframe.

By the way, why do have to change some points of the design in the "template.css" and other ones in the "index.php" file?

Offline dbs

  • Betatester
  • **
  • Posts: 8737
  • Gender: Male
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: delete gaps between frames
« Reply #5 on: May 19, 2012, 07:39:28 PM »
Quote
But the code for the index.php hasn´t solved the problem with the large menuframe.
plz copy&paste my code. your code looks wrong.

your margin-right is not what you want, you need margin-left. (i think)  :wink:

Quote
By the way, why do have to change some points of the design in the "template.css" and other ones in the "index.php" file?
I don't know, it's your template.
Work in index.php with classes and/or id's, than you can all style in css.
HTML & CSS are basics and not WebsiteBaker-specific. You will find many help in Google
or here: http://www.websitebaker2.org/de/hilfe/designerhandbuch.php?lang=DE.
« Last Edit: May 19, 2012, 07:53:04 PM by dbs »

Offline spiderpig2008

  • Posts: 10
Re: delete gaps between frames
« Reply #6 on: May 23, 2012, 08:41:59 PM »
Thank you again.

Now the construction of the design is how I imagined. But there is a problem with the german letters ü and ä.
For instance: The german "zurück" is shown as zurück.
But the problem is just existing when I use the letters in the menubox. If I use them in the content I don´t have these problems.

I googled but I just found that I have to change the charset in the index.php. I tried it and it doesnt work.

Can someone help me?

Offline spiderpig2008

  • Posts: 10
Re: delete gaps between frames
« Reply #7 on: May 26, 2012, 01:07:05 PM »
Does realy no one can help me?

If you need some more Information to solute, let me know!

Offline nibz

  • Posts: 684
  • Gender: Male
Re: delete gaps between frames
« Reply #8 on: May 26, 2012, 01:27:23 PM »
How did you set your charset in the template?

Example of good usage
Code: [Select]
<meta http-equiv="Content-Type" content="text/html; charset=<?php if(defined('DEFAULT_CHARSET')) { echo DEFAULT_CHARSET; } else { echo 'utf-8'; }?>" />

Offline spiderpig2008

  • Posts: 10
Re: delete gaps between frames
« Reply #9 on: May 29, 2012, 11:47:30 AM »
Hi nibz,

I set the template on utf8 but it didn´t work.

May I have to change something in the mysql daba.

The strange point is, I have the problems with the wrong letters just in the menu and in the wb-backend, but not in the wysiwyg-content.

Offline nibz

  • Posts: 684
  • Gender: Male
Re: delete gaps between frames
« Reply #10 on: May 29, 2012, 08:28:06 PM »
Which version and refision are you using?
2.8.3 ?
And did you install the hotfix?

instantflorian

  • Guest
Re: delete gaps between frames
« Reply #11 on: May 29, 2012, 11:25:12 PM »
Hi,

this is no problem with the hotfix or the charseit which is set by the template. The wrong characters are saved in the database, what sometimes happens when exporting/importing data. So you either have to browse your complete site and correct the ü etc. manually (what is probably easier regarding the small site) or dump the database to an sql file, replace all the crappy chars with &auml; etc. and re-import it.

Oh, by the way, building a website with tables is "a bit" old fashioned....

BR
_florian.

Offline spiderpig2008

  • Posts: 10
Re: delete gaps between frames
« Reply #12 on: June 01, 2012, 04:08:51 PM »
Thank you for your answers and thank you Instantflorian for your hint but I don´t care if my method is old fashioned. First priority is, that the website is working. And it does despite the problems with ä and ü. :)

I have opened the SQL Daba but i didn´t find the incorrect letters. Could anyone tell me where I can approximately find them?


Offline marmot

  • Posts: 1103
Re: delete gaps between frames
« Reply #13 on: June 01, 2012, 10:40:09 PM »
Hi,

how about simply using html-entities ?
Which means ü becomes &uuml; for example.

regards

Offline spiderpig2008

  • Posts: 10
Re: delete gaps between frames
« Reply #14 on: June 09, 2012, 03:38:16 PM »
Hey marmot,

thank you for this fast and easy solution.

It has worked.

Thank you all for your help!

Best regards and a nice European Championchip! :)
May the best win!