|
|
| Harris Kosmidhs 2007-03-22, 7:22 pm |
| I have my whole page in a <table> just to center it.
Now I changed it and used a div instead:
#wrapper {
width:900px;
margin:0 auto 0 auto;
border-left:1px solid;
border-right:1px solid;
background-color:#fff;
}
body has a gray background.
Ommiting div's height makes div having a height of one line thus not
wrapping the whole page.
If I use height:100% the div wraps until the screen height.
How can I wrap the hole page? The page's height varies as it dynamically
get the text from a mysql server.
thanks
PS: my html structure is:
<body>
<div id="wrapper"> My site </div>
</body>
| |
| Jukka K. Korpela 2007-03-22, 7:22 pm |
| Scripsit Harris Kosmidhs:
> I have my whole page in a <table> just to center it.
> Now I changed it and used a div instead:
Why? It's the idea that matters, not the implementation. What do you plan to
achieve by changing the implementation?
Using modern authoring approaches for _new_ pages. This includes new design,
not just "changing tables to divs", which isn't even always a reasonable
idea in practice.
> #wrapper {
> width:900px;
> margin:0 auto 0 auto;
> border-left:1px solid;
> border-right:1px solid;
> background-color:#fff;
> }
The idea of 900 pixels wide page is wrong. It's fairly irrelevant how you
try to implement it.
> Ommiting div's height makes div having a height of one line thus not
> wrapping the whole page.
That's a really short page then.
> PS: my html structure is:
You should have posted a URL, not a snippet of code. You should also explain
what you really want. "Wrapping" is vague word, especially since the problem
_seems_ to be that you want the element _height_ set to something else than
its natural height (dictated by its content).
--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/
| |
| Harris Kosmidhs 2007-03-22, 7:22 pm |
| Jukka K. Korpela wrote:
> Scripsit Harris Kosmidhs:
>
>
> Why? It's the idea that matters, not the implementation. What do you
> plan to achieve by changing the implementation?
>
The design is a mixed one with divs and tables.
I want to change it to use only divs. That's teh firts step.
> The idea of 900 pixels wide page is wrong. It's fairly irrelevant how
> you try to implement it.
>
How do you define wrong? It's not liquid? Liquid is ONE design option.
The other is a fixed one.
I have a photo banner which is 900px and I want to define the width of
the design
http://www.blackout.gr/keimena/81
> You should have posted a URL, not a snippet of code. You should also
> explain what you really want. "Wrapping" is vague word, especially since
> the problem _seems_ to be that you want the element _height_ set to
> something else than its natural height (dictated by its content).
Consider http://www.blackout.gr/teuxh_new.php for an example
The #wrapper div only goes until the screen height. After that you can
see the gray body background.
If I remove height:100% from the #wrapper the div only extends in one line.
| |
|
| Harris Kosmidhs wrote:
> I have my whole page in a <table> just to center it.
> Now I changed it and used a div instead:
>
> #wrapper {
> width:900px;
> margin:0 auto 0 auto;
> border-left:1px solid;
> border-right:1px solid;
> background-color:#fff;
> }
>
Apply a class to each table setup row.
table {
width : 90%;
margin : 0 auto;
border-left : 1px solid;
border-right : 1px solid;
background-color : #fff;
}
..leftColumn {
width : 15%
background : ...
}
....
<table>
<tr>
<td class="leftColumn"></td>
<td class="centerColumn"></td>
<td class="rightColumn"></td>
</tr>
</table>
Toy with something like this and see how it works for you. You'll have
easier control of the cell and the table width, without having to scroll
up and down your HTML if you decide you don't like the width.
The can also use <table id="wrapper"> or <div id="wrapper" before
<table> if you plan on using other tables.
| |
| Johannes Koch 2007-03-22, 7:22 pm |
| Harris Kosmidhs schrieb:
[wrapper having 'no' height]
> PS: my html structure is:
> <body>
> <div id="wrapper"> My site </div>
> </body>
Floated blocks don't add to the calculation of the wrapper div's height.
--
Johannes Koch
Spem in alium nunquam habui praeter in te, Deus Israel.
(Thomas Tallis, 40-part motet)
| |
| Harris Kosmidhs 2007-03-23, 7:15 am |
| Johannes Koch wrote:
> Harris Kosmidhs schrieb:
>
> [wrapper having 'no' height]
>
> Floated blocks don't add to the calculation of the wrapper div's height.
Thanks for reminding me this. I knew that I forget something. But how
can you overcome this problem?
If i have a
<div id="#wrapper">
<div>
and here floated divs..
</div>
</div>
will it work?
Thanks
| |
|
| On 2007-03-23, Harris Kosmidhs <hkosmidi@remove.me.softnet.tuc.gr> wrote:
> Johannes Koch wrote:
>
> Thanks for reminding me this. I knew that I forget something. But how
> can you overcome this problem?
Usually with clear. Put another block with clear:both set on it at the
end of the containing block.
>
> If i have a
><div id="#wrapper">
><div>
> and here floated divs..
></div>
>
></div>
>
> will it work?
>
> Thanks
| |
| Andy Dingley 2007-03-23, 7:15 am |
| On 23 Mar, 08:54, Harris Kosmidhs <hkosm...@remove.me.softnet.tuc.gr>
wrote:
> <div id="#wrapper">
<div id="wrapper">
| |
|
| Harris Kosmidhs wrote:
> Johannes Koch wrote:
>
> Thanks for reminding me this. I knew that I forget something. But how
> can you overcome this problem?
>
> If i have a
> <div id="#wrapper">
> <div>
> and here floated divs..
> </div>
>
> </div>
>
> will it work?
>
> Thanks
If you want a background color in any of your columns and you're not
using an image, the height will not be 100%. If you're not using a
background image but a background color then you should use a table.
You can do some really cool stuff with background images, css and
absolute positioning, but I find it to be more work than it's worth but
if you're willing to invest the time it'll give you what you're looking for.
If my memory serves me correctly, the Adobe website uses a background
image, absolute positioning and floating divs. It's done very well but
it's also very complicated.
|
|
|
|
| Copyright 2003 - 2008 forum4designers.com Software forum Computer Hardware reviews |