 | |
Re: Border / Background inconsistent?
Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)
 |
| | Thread Tools | Display Modes |
#1
 
| |||
| |||
|
Re: Border / Background inconsistent? -
10-22-2007
, 02:52 AM
|
You don't want http://netweaver.com.au/test/howa.html OK. The Dorayme Factory has 2 more offerings for you: http://netweaver.com.au/test/howa2.html http://netweaver.com.au/test/howa3.html You gotta like one of these, I have them on special till midnight tonight. (I am a bit unknowing about what you quite want... but anyway. I am here on earth to help the poor, the sick, the immigrants, and all who have fallen on hard times...) -- dorayme Thank you very much. But still, my problem is: I don't want to specify the width of my header, I want it to `auto width`, in which, consistent with the table width (this can be changed). Thanks again. |
the page about, what is the content? Why do youy even want to
have a div at all? What is in this div, what is its point. I can
sort of see why you might want a table (I am suspicious of the
value of giving it such a width for any public web page where
people can not be expected to g=have huge screens and are not
likely to welcome horizontal scrolling. But perhaps that is not
my business right now?).
About divs, they are by default 100% wide. Anyway, how about
<http://netweaver.com.au/test/howa5.html>
(Please don't ask about howa4.html, I beg you.... <g>)
--
dorayme
#2
| |||
| |||
|
|
About divs, they are by default 100% wide. Anyway, how about http://netweaver.com.au/test/howa5.html dorayme |
This is exactly the example I given above - the div is 100% to the
current browser view port (try to resize the browser), but the table
is in overflow.
What I want is: If there are any objects (e.g. table) in the remaining
of the page make the browser to overflow with horizontal scrollbar,
let make the header also has the full width of that object.
#3
| |||
| |||
|
|
On 10 22 , 2 52 , dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote: About divs, they are by default 100% wide. Anyway, how about http://netweaver.com.au/test/howa5.html dorayme Thank you again. This is exactly the example I given above - the div is 100% to the current browser view port (try to resize the browser), but the table is in overflow. What I want is: If there are any objects (e.g. table) in the remaining of the page make the browser to overflow with horizontal scrollbar, let make the header also has the full width of that object. |
window happens to be, no more and no less in a compliant browser
like Firefox or Safari. You were querying about how to so make
it. You have noticed the zeroing of the margin in the css head to
remove all defaults?
In my example the table width is fixed at 1240px. No more and no
less. If the browser window is not wider than 1200 or so, you
cannot see the end of the table, you get a horizontal scrollbar.
That is what you want, you say? If the browser window is opened
up on a big screen, you can *see* the table end and the scrollbar
disappears. This is surely ok too?
I hope someone can help you on the info provided. The others
simply sleep too much or are pretending they have a life (it has
been talked about recently and no one but the shameless dares to
seem not to have)
Perhaps I should turn on my Windows machine and see all this in
IE, perhaps there is some funny business with table width in that
browser... would not surprise me! I will if no one has helped you
soon...
--
dorayme
#4
| |||
| |||
|
|
In my example the table width is fixed at 1240px. No more and no less. If the browser window is not wider than 1200 or so, you cannot see the end of the table, you get a horizontal scrollbar. That is what you want, you say? dorayme |
Maybe I am not clear, to make it simple, I would say:
In the http://netweaver.com.au/test/howa5.html, If the table width is
1204px, I want the header also has 1204 width, If the table has 9999px
width, I also want the header to have this full width, not 100% of the
current visible width of the browser.
(But I don't want to hard code the value as the header width, also I
want to keep the existing structure)
(p.s. I am using FF 2.0)
Thanks.
#5
| |||
| |||
|
|
On 10 22 , 3 38 , dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote: In my example the table width is fixed at 1240px. No more and no less. If the browser window is not wider than 1200 or so, you cannot see the end of the table, you get a horizontal scrollbar. That is what you want, you say? dorayme Thanks again. Maybe I am not clear, to make it simple, I would say: In the http://netweaver.com.au/test/howa5.html, If the table width is 1204px, I want the header also has 1204 width, If the table has 9999px width, I also want the header to have this full width, not 100% of the current visible width of the browser. (But I don't want to hard code the value as the header width, also I want to keep the existing structure) (p.s. I am using FF 2.0) Thanks. |
data informational purpose (like relating prices and products and
other info to each other)? If it is just for layout, you might as
well go the whole way and your problem will be solved by making
the header a table row. No?
If the table is truly a tabular affair and you want a header to
be the same size as the table and you know the size of the table
width but do not want to use this as a basis to dimension the
width of the header, then it makes it hard, I agree.
This will do it for Firefox:
<http://netweaver.com.au/test/howa6.html>
Since you do not want hard dimensioning in, I have made the
example table more realistic. (best is simply not to put in width
at all for tabe in general. They have magic properies and find
their own widths by taking into account their content and the
browser window.
--
dorayme
#6
| |||
| |||
|
|
On 10 22 , 3 38 , dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote: In my example the table width is fixed at 1240px. No more and no less. If the browser window is not wider than 1200 or so, you cannot see the end of the table, you get a horizontal scrollbar. That is what you want, you say? dorayme Thanks again. Maybe I am not clear, to make it simple, I would say: In the http://netweaver.com.au/test/howa5.html, If the table width is 1204px, I want the header also has 1204 width, If the table has 9999px width, I also want the header to have this full width, not 100% of the current visible width of the browser. |
<div style="float: left">
<div style="border: 2px solid red">header</div>
<table style="width: 1240px; border: 2px solid green">
<tr>
<td>sss</td>
</tr>
</table>
<div style="clear: left"></div>
</div>
The reason for wrapping everything in a float is that a float has
shrink-to-fit width, or in this case, stretch-to-fit width: it will be
made wide enough for its contents, in other words, wide enough for that
huge table.
The header gets its width from its container, which is that
stretched-out float.
I put the clearing div in at the end just to be safe, so subsequent
things won't go to the right of the float for people with viewports
wider than 1240px.
#7
| |||
| |||
|
|
How about this: div style="float: left" div style="border: 2px solid red">header</div table style="width: 1240px; border: 2px solid green" tr td>sss</td /tr /table div style="clear: left"></div /div |
Thanks.
#8
| |||
| |||
|
|
The reason for wrapping everything in a float is that a float has shrink-to-fit width, or in this case, stretch-to-fit width: it will be made wide enough for its contents, in other words, wide enough for that huge table. The header gets its width from its container, which is that stretched-out float. I put the clearing div in at the end just to be safe, so subsequent things won't go to the right of the float for people with viewports wider than 1240px. |
possible to do the same thing?
#9
| |||
| |||
|
|
On 10 22 , 5 06 , Ben C <spams... (AT) spam (DOT) eggs> wrote: The reason for wrapping everything in a float is that a float has shrink-to-fit width, or in this case, stretch-to-fit width: it will be made wide enough for its contents, in other words, wide enough for that huge table. The header gets its width from its container, which is that stretched-out float. I put the clearing div in at the end just to be safe, so subsequent things won't go to the right of the float for people with viewports wider than 1240px. One more follow up, if my header is also using table (not div), is it possible to do the same thing? |
This is because tables have shrink-to-fit auto width, not greedy auto
width. So if you want a table to take all its available space, it needs
width: 100%. If you want a normal-flow block box (e.g. an unstyled div)
to take all its available space, you just leave it alone and it will
help itself.
#10
| |||
| |||
|
|
That's what you should get with the markup above. Works for me in Firefox, Opera and Konqueror. What browser or browser-shaped-object are you testing this in? |
Thanks again.
|
« Previous Thread
|
Next Thread »
| Thread Tools | |
| Display Modes | |
Linear Mode
| |
Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.