By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
454,632 Members | 1,425 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 454,632 IT Pros & Developers. It's quick & easy.

Struggling to convert this layout into CSS

P: n/a
The idea of this is very simle. The site is 800px wide and sits in the
middle of the browser window, on either side of the site I want a different
background image aligned against it. If I were doing this with table based
layout the code would be as follows:

<head>
<style type="text/css">

#bgleft {
background: url(left_half_circle.gif) right top repeat-y;
}

#bgright {
background: url(right_half_circle.gif) left top repeat-y;
}

</style>
</head>
<body marginheight="0" marginwidth="0" topmargin="0" leftmargin="0">

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="49%" id="bgleft"><img src="pixel.gif" alt="" height="1"
width="1"></td>
<td width="2%" valign="top">

My 800px wide content goes here<br>
<img src="foo.gif" width="800" height="1000">

<td width="49%" id="bgright"><img src="pixel.gif" alt="" height="1"
width="1"></td>
</tr>
</table>

</body>
</html>

For reference assume the left bg image is like:
http://www.gdls.com/images/contacts/...alf_circle.gif and the right like
this: http://www.gdls.com/images/contacts/...alf_circle.gif
Mar 10 '07 #1
Share this Question
Share on Google+
26 Replies


P: n/a
mark wrote:
The idea of this is very simle.
Actually, it *could* be simple [sic], but the way you've described it,
it really isn't. The problem as you've posed it seems to be
unnecessarily complicated.
The site is 800px wide
But my browser's viewport is 792px wide. :-( (Sometimes it's 1280px, but
a lot of the time it's somewhere in between. Most of the time -- in
fact, virtually ALL of the time -- it's some size different from 800px.)
and sits in the
middle of the browser window,
well, not when it's wider than the browser window
on either side of the site I want a different
background image aligned against it. If I were doing this with table based
layout the code would be as follows:
Wait a minute; if you *were*... it *would*...? Awfully conditional words
for an existing site. Is that why you didn't provide a URL? Because you
don't have actual code you're trying to "convert"?
<head>
<style type="text/css">

#bgleft {
background: url(left_half_circle.gif) right top repeat-y; }
#bgright {
background: url(right_half_circle.gif) left top repeat-y; }
You may (or may not) want to name your classes based on function rather
than content. When I see #"bgleft", I think it's the background you want
on the left. You mean it to be the background made of left-half
semi-circles. Even if we assume you're going to always want your
right-side border decoration on the right, it's still possible you will
want to change the decoration, i.e., use some other image, like
squiggles.gif. In that case, "#bgleft" will be pretty silly.
</style>
</head>
<body marginheight="0" marginwidth="0" topmargin="0" leftmargin="0">

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="49%" id="bgleft"><img src="pixel.gif" alt="" height="1"
width="1"></td>
<td width="2%" valign="top">

My 800px wide content goes here<br>
<img src="foo.gif" width="800" height="1000">

<td width="49%" id="bgright"><img src="pixel.gif" alt="" height="1"
width="1"></td>
</tr>
</table>
</body>
</html>
Is it because the code isn't actual (but merely typed in to your post on
the fly) that the code above doesn't do what you claim you want it to
do? Aren't you aware that the "800px wide content" isn't likely to be
800px except on a 40000px or wider display?
>
For reference assume the left bg image is like:
http://www.gdls.com/images/contacts/...alf_circle.gif and the right like
this: http://www.gdls.com/images/contacts/...alf_circle.gif
How about for reference we assume you copied and pasted without paying
attention? ;-)

Anyway, I took a swing at what I thought you might really want, and I
came up with this (doctype HTML 4.01 strict, et. al. omitted):

img#foo { width:800px; height:1000px; }
#bgright { background: url(right_half_circle.gif) left top repeat-y; }
#bgleft { background: url(left_half_circle.gif) right top repeat-y; }
#stuff {width:800px; margin:.5em auto;

<div id="bgright">
<div id="bgleft">
<p id="stuff">My 800px wide content goes here
<img id="foo" src="foo.gif" alt="foo"></p>
</div>
</div>

Tested in FF, Netscape, Opera and IE6. It *does not work* cleanly in my
Opera, which doesn't seem to accept the width setting as a maximum.
(For Opera, you'd need to add the <brright before the <imgin the
HTML, after which it breaks OK, but the auto margins still don't work.)
There are probably known workarounds for this, but I will let you look
for them yourself. I'm not even sure I've been addressing your real problem.

--
John
Mar 10 '07 #2

P: n/a

"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
mark wrote:
>The idea of this is very simle.

Actually, it *could* be simple [sic], but the way you've described it, it
really isn't. The problem as you've posed it seems to be unnecessarily
complicated.
I'll wait and see your solution then...
>The site is 800px wide

But my browser's viewport is 792px wide. :-( (Sometimes it's 1280px, but a
lot of the time it's somewhere in between. Most of the time -- in fact,
virtually ALL of the time -- it's some size different from 800px.)
this is totally beside the point, why are you trying to be smart by picking
me out on a sample value I gave merely for the benefit of this example? I
could have given 400px, 600px, 1200px. It's merely used for testing
purposes.
> and sits in the middle of the browser window,

well, not when it's wider than the browser window
yawn
>
> on either side of the site I want a different
background image aligned against it. If I were doing this with table
based layout the code would be as follows:

Wait a minute; if you *were*... it *would*...? Awfully conditional words
for an existing site. Is that why you didn't provide a URL? Because you
don't have actual code you're trying to "convert"
Mate, what is your problem? I didn't provide a URL because I'm testing
locally. I've provided sample code, really sorry if it's not good enough for
you. If you wish to test it, then all you have to do is copy and paste and
save the images I linked.
><head>
<style type="text/css">

#bgleft {
background: url(left_half_circle.gif) right top repeat-y; }
#bgright {
background: url(right_half_circle.gif) left top repeat-y; }

You may (or may not) want to name your classes based on function rather
than content. When I see #"bgleft", I think it's the background you want
on the left. You mean it to be the background made of left-half
semi-circles. Even if we assume you're going to always want your
right-side border decoration on the right, it's still possible you will
want to change the decoration, i.e., use some other image, like
squiggles.gif. In that case, "#bgleft" will be pretty silly.
why are you talking at me like I'm some kind of retard? I'm testing out a
layout, end of story. I'm sorry if you don't like the way I'm named my IDs.
></style>
</head>
<body marginheight="0" marginwidth="0" topmargin="0" leftmargin="0">

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="49%" id="bgleft"><img src="pixel.gif" alt="" height="1"
width="1"></td>
<td width="2%" valign="top">

My 800px wide content goes here<br>
<img src="foo.gif" width="800" height="1000">

<td width="49%" id="bgright"><img src="pixel.gif" alt="" height="1"
width="1"></td>
</tr>
</table>
</body>
</html>

Is it because the code isn't actual (but merely typed in to your post on
the fly) that the code above doesn't do what you claim you want it to do?
I'm sorry, but it does. I tested it before putting it into the post. I've
also used this type of layout many times before. I find it funny that you
tell me my code doesn't do what I already know it does. More like you don't
actually understand what I want.
Aren't you aware that the "800px wide content" isn't likely to be 800px
except on a 40000px or wider display?
why are you giving me lectures? It seems you have no interest in trying to
answer my post, you just want to big yourself up by trying to correct me in
every instance
>For reference assume the left bg image is like:
http://www.gdls.com/images/contacts/...alf_circle.gif and the right
like this: http://www.gdls.com/images/contacts/...alf_circle.gif

How about for reference we assume you copied and pasted without paying
attention? ;-)
sorry, you're wrong. The code I posted works EXACTLY as intended. I pasted
the same link twice(really sorry), but doesn't take a genuis to figure out I
made a typo given the image names are right there in the CSS
Anyway, I took a swing at what I thought you might really want, and I came
up with this (doctype HTML 4.01 strict, et. al. omitted):

img#foo { width:800px; height:1000px; }
#bgright { background: url(right_half_circle.gif) left top repeat-y; }
#bgleft { background: url(left_half_circle.gif) right top repeat-y; }
#stuff {width:800px; margin:.5em auto;

<div id="bgright">
<div id="bgleft">
<p id="stuff">My 800px wide content goes here
<img id="foo" src="foo.gif" alt="foo"></p>
</div>
</div>
well, that really is proof you didn't test my code(all you had to do was
copy and paste it into a HTML file and save the images). This is not at all
what I wanted. You've put the backgrounds at either side of the browser
window, far left and far right. The images themselves are unimportant(they
could be pictures of pigs on motorbikes). You could put a any image you want
there, the point is where the sit. In the sample code I gave the background
are fixed on either side of the content div, not on either side of the
browser window.
>I'm not even sure I've been addressing your real problem.
that's the only thing you've said in your whole post that I actually agree
with. Why do you have to be such an ass when responding? I would have
forgiven you if at the end you'd come up with a solution but you got it
totally wrong, telling my my code doesn't work when it actually does.
Mar 10 '07 #3

P: n/a
"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...

Here is what I see if I paste the code in my OP into a HTML file along with
the images:

http://img112.imageshack.us/my.php?i...icture2tm6.png (
http://img112.imageshack.us/img112/5360/picture2tm6.png )

resized browser:

http://img294.imageshack.us/my.php?i...icture3dt4.png (
http://img294.imageshack.us/img294/4214/picture3dt4.png ) notice there are
no horizontal scrollbars.

This is exactly what I want to achieve. Therefore you are wrong in saying
that my code is wrong, or that I didn't check my code before posted. I
suggest you get your facts straight before calling my out in such a way.
Mar 10 '07 #4

P: n/a
Rik
mark <ma***@localhost.netwrote:
>>The site is 800px wide

But my browser's viewport is 792px wide. :-( (Sometimes it's 1280px,
but a
lot of the time it's somewhere in between. Most of the time -- in fact,
virtually ALL of the time -- it's some size different from 800px.)

this is totally beside the point, why are you trying to be smart by
picking
me out on a sample value I gave merely for the benefit of this example? I
could have given 400px, 600px, 1200px. It's merely used for testing
purposes.
That's beside the point. What he actually was telling you is that you
shouldn't have a fixed width.
Mate, what is your problem? I didn't provide a URL because I'm testing
locally. I've provided sample code, really sorry if it's not good enough
for
you. If you wish to test it, then all you have to do is copy and paste
and
save the images I linked.
Consider this is free advise, and you already have the files. Now, someone
checking aht you mean has to copy/paste the code, put it up, make sure
(s)he is not making errors in copy/pasting, and even then there might be
side-issues that aren;t conveyed (like HTTP-headers etc.)

What you are saying here is: I'm to lazy to do that work, so instead, I'll
make every single person trying to give me an answer do it over and over..
Now, that's inviting...
>You may (or may not) want to name your classes based on function rather
than content. When I see #"bgleft", I think it's the background you want
on the left. You mean it to be the background made of left-half
semi-circles. Even if we assume you're going to always want your
right-side border decoration on the right, it's still possible you will
want to change the decoration, i.e., use some other image, like
squiggles.gif. In that case, "#bgleft" will be pretty silly.

why are you talking at me like I'm some kind of retard? I'm testing out a
layout, end of story. I'm sorry if you don't like the way I'm named my
IDs.
This was sound advise. If you choose not to feel insulted by it it sais
more about you then about him.
>></style>
</head>
<body marginheight="0" marginwidth="0" topmargin="0" leftmargin="0">

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="49%" id="bgleft"><img src="pixel.gif" alt="" height="1"
width="1"></td>
<td width="2%" valign="top">

My 800px wide content goes here<br>
<img src="foo.gif" width="800" height="1000">

<td width="49%" id="bgright"><img src="pixel.gif" alt="" height="1"
width="1"></td>
</tr>
</table>
</body>
</html>

Is it because the code isn't actual (but merely typed in to your poston
the fly) that the code above doesn't do what you claim you want it to
do?

I'm sorry, but it does. I tested it before putting it into the post. I've
also used this type of layout many times before. I find it funny that you
tell me my code doesn't do what I already know it does. More like you
don't
actually understand what I want.
<table>
<tr>
<td></td>
dome random content inside tr, outside any td
<td></td>
</tr>
</table>
Isn't exactly valid html.
>Aren't you aware that the "800px wide content" isn't likely to be 800px
except on a 40000px or wider display?

why are you giving me lectures? It seems you have no interest in trying
to
answer my post, you just want to big yourself up by trying to correct me
in
every instance
If both the left td and the right td are 49%, this means that even if we
have the middle td, this should actually be 2% of the tablewidth wide. If
you have an image 800px wide, you assume a width of the viewport of
40000px?

If you don't want any real answers, don't post. If you want people saying
'Oooh, you're so smart, what a briljant layout.' this is not te place for
it.

You know what, I throw in the towel before even starting, even if you do
provide an url later. It's abundantly clear you don't want real answers or
learn anything.
--
Rik Wasmus
Posted on Usenet, not any forum you might see this in.
Ask Smart Questions: http://tinyurl.com/anel
Mar 10 '07 #5

P: n/a
"Rik" <lu************@hotmail.comwrote in message
news:op.tozbb2xpqnv3q9@misant...
mark <ma***@localhost.netwrote:
>>The site is 800px wide
>That's beside the point. What he actually was telling you is that you
shouldn't have a fixed width.
I know exactly what he was telling me, totally beside the point. My sample
code didn't have a doctype either, surprised that wasn't pointed out aswell.
It was sample code, this is not a debate about fixed widths vs. percentage
widths.
>What you are saying here is: I'm to lazy to do that work, so instead, I'll
make every single person trying to give me an answer do it over and over.
Now, that's inviting...
Lazy to upload it? I didn't upload because I cannot do that right now. I
created a code sample especially for testing purposes, would you rather me
link to a full site that has 1000's of lines of code that bare no relevance
to the problem so you have to go fishing through it? even if I did upload
it, whoever wished to help me would need to copy and paste the code, or save
it locally to test. I really do think you are making a big issue out of
this. I'm sorry for not being able to upload.
><table>
<tr>
<td></td>
dome random content inside tr, outside any td
<td></td>
</tr>
</table>
Isn't exactly valid html.
where are you getting that from? It seems I missed a </tdby mistake but
shouldn't cause a problem for testing.
>If both the left td and the right td are 49%, this means that even if we
have the middle td, this should actually be 2% of the tablewidth wide. If
you have an image 800px wide, you assume a width of the viewport of
40000px?
Did you test the code? the table has a width of 100%, it will only stretch
wider if the content of the cells pushes it wider. The fact that the middle
cell has a 2% width doesn't matter because the 800px content pushes it out
and pushes the 2 outer 49% cells smaller. It's used to keep the center cell
exactly in the center but always retaining a fixed width.
>If you don't want any real answers, don't post. If you want people saying
'Oooh, you're so smart, what a briljant layout.' this is not te place for
it.
saying the width is going to be 4000px is not a real answer given the code
sample I gave does nothing of the sort. Tables just don't work like that. If
you define the width of a table as 100%, you can give cells widths of 10000%
and the table will not be wider than 100%. I assumed(perhaps wrongly) that
most people understood this.
>You know what, I throw in the towel before even starting, even if you do
provide an url later. It's abundantly clear you don't want real answers or
learn anything.
sorry you feel that way but as I've said, you've mis-understood clearly if
you think the width of the sample code will be 4000px. How can I accept
these 'real' answers if they are clearly wrong?
Mar 10 '07 #6

P: n/a
On Sat, 10 Mar 2007 14:57:53 -0000, "mark" <ma***@localhost.net>
wrote:
>This is exactly what I want to achieve.
Then there is no need to continue this thread. :)

--
Zilbandy
Mar 10 '07 #7

P: n/a
mark wrote:
>
I didn't upload because I cannot do that right now. I
created a code sample especially for testing purposes, would you rather me
link to a full site that has 1000's of lines of code that bare no relevance
to the problem so you have to go fishing through it?
Um, no. You apparently already made a reduced test case. You should
upload that to a publicly available server so everyone can see it.
even if I did upload
it, whoever wished to help me would need to copy and paste the code, or save
it locally to test.
That's not really relevant. If your sample were already online, whoever
had a mind to look at it would see a "functioning" sample without any
more effort than following a link, and may know (from experience) what
your issue *really* is and a probably solution, without needing to go
any further.

Besides, it's a lot easier to save a complete web page than doing a
copy/paste from a post, plus posted code often does not tell the whole
story. A URL does.
I really do think you are making a big issue out of this.
I really do think you should have lurked in this newsgroup a bit before
posting. Then you would have read numerous posts about the accepted
convention of this group: post a URL, not code.
I'm sorry for not being able to upload.
I'm sorry you don't want to make it easy for people to help you. You'll
get a lot better response if you don't try to bite the hand that feeds you.

--
Berg
Mar 10 '07 #8

P: n/a
"Bergamot" <be******@visi.comwrote in message
news:55*************@mid.individual.net...
mark wrote:
>>
I didn't upload because I cannot do that right now. I
created a code sample especially for testing purposes, would you rather
me
link to a full site that has 1000's of lines of code that bare no
relevance
to the problem so you have to go fishing through it?

Um, no. You apparently already made a reduced test case. You should
upload that to a publicly available server so everyone can see it.
I just didn't have one(sorry). It takes literally 5 seconds to copy and
paste the code in blank file and save it. A lot quicker IMO that it would
for you to go looking through a huge page full of code just to whittle down
to the problem area. I even posted images of the page rendering.
>
I really do think you should have lurked in this newsgroup a bit before
posting. Then you would have read numerous posts about the accepted
convention of this group: post a URL, not code.
this seems to be at odds with many css forums who usually prefer stripped
down code samples. I shall remember not to post here again unless I'm able
to post my full url. TBH I thought I was making it easier by posting the
sample the way it was. I stripped out everything that else that wasn't
related to this particular problem. I know if someone wanted my help I would
rather see the stripped down sample than a whole bunch of unrelated code
that complicates things.
>I'm sorry for not being able to upload.

I'm sorry you don't want to make it easy for people to help you. You'll
get a lot better response if you don't try to bite the hand that feeds
you.
Nobody is feeding me here. I managed to get help at another forum without
all the BS lectures and wrong assumptions. Funnily enough they had no
trouble understand the sample code I posted.

There's always guys on groups like this who have nothing better to do that
pick people to bits over minor detail. The responses to my post are
laughable, especially some of the so called 'hands that feeds' solutions. If
these guys can't even understand the simple table code I posted then I
imagine they have no idea how to solve it in CSS. A 4000px table, c'mon. :-/
Mar 10 '07 #9

P: n/a
mark wrote:
"Bergamot" <be******@visi.comwrote in message
news:55*************@mid.individual.net...
>>
the accepted convention of this group: post a URL, not code.

this seems to be at odds with many css forums
This isn't a forum. It's Usenet.

--
Berg
Mar 11 '07 #10

P: n/a
mark wrote:
"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
>>mark wrote:
>>>The idea of this is very simle.

Actually, it *could* be simple [sic], but the way you've described it, it
really isn't. The problem as you've posed it seems to be unnecessarily
complicated.

I'll wait and see your solution then...
>>>The site is 800px wide

But my browser's viewport is 792px wide. :-( (Sometimes it's 1280px, but a
lot of the time it's somewhere in between. Most of the time -- in fact,
virtually ALL of the time -- it's some size different from 800px.)

this is totally beside the point, why are you trying to be smart by picking
me out on a sample value I gave merely for the benefit of this example? I
could have given 400px, 600px, 1200px. It's merely used for testing
purposes.
Nobody knows what the point is, nobody knows who you are, nobody knows
what or how much you know. We can only judge you by your posts. This
seems to be your first one, so that's not much information.

The information we *do* have includes experience with lots of different
problems raised by lots of different people, here and in other NGs. That
experience includes a lot of attempts to design to exactly one fixed
width. These attempts fail more often than not, I think, not least
because the goal is ill-advised in the first place; fixed-width designs
presume too much. Discussed ad nauseum in c.i.w.a.s already. Still, it
doesn't seem clear that you know about that, because you're suggesting
you desgn the problem with a different fixed width. If you *had* given
600px, my answer would have been exactly the same.

And if 800px is to be "merely used for testing purposes," then next time
say, "imagine I have a site set at 800px, fixed for testing purposes."
You might not get the potentially helpful advice concerning fixed
widths. Then again, you might.

And friend, I *always* try to be smart. Don't you? :-)
>> and sits in the middle of the browser window,

well, not when it's wider than the browser window

yawn
frown
>
>> on either side of the site I want a different
background image aligned against it. If I were doing this with table
based layout the code would be as follows:

Wait a minute; if you *were*... it *would*...? Awfully conditional words
for an existing site. Is that why you didn't provide a URL? Because you
don't have actual code you're trying to "convert"

Mate, what is your problem? I didn't provide a URL because I'm testing
locally. I've provided sample code, really sorry if it's not good enough for
you. If you wish to test it, then all you have to do is copy and paste and
save the images I linked.
My problem, mate, is that I tried to help you, and you chose (a) to make
it difficult to help you, and (b) to insult me when I did.

I didn't "wish to test it," but you asked for help, and when a brother
needs help, I like to be able to provide it. Your post was just sitting
there unanswered for an hour, so I went the extra distance. Your welcome.

By the way, as Rik has pointed out, copy-and-paste is more trouble than
some problems are worth for some people, so you reduce the quantity of
help you might get. Besides which, if it's so damn easy to do it, why
don't *you* do it? It's "all you have to do."

If *you* can't be bothered doing the minimum work, why should each of us?

[OP's CSS and my advice about class names snipped]
why are you talking at me like I'm some kind of retard? I'm testing out a
layout, end of story. I'm sorry if you don't like the way I'm named my IDs.
It's the "end of story" if you keep testing locally and don't ask for
help in a public NG. If you post to usenet you run the risk of having
your code discussed publicly, by people who know much, much more than
you (the advantage of Usenet) as well as by people with less of a clue
(the disadvantage of Planet Earth). My remarks were meant as helpful tips.
[OP's code snipped]
>>Is it because the code isn't actual (but merely typed in to your post on
the fly) that the code above doesn't do what you claim you want it to do?

I'm sorry, but it does. I tested it before putting it into the post. I've
also used this type of layout many times before. I find it funny that you
tell me my code doesn't do what I already know it does. More like you don't
actually understand what I want.
I'm sorry, but it doesn't. I didn't copy and paste your code and then
test in IE. Because I have Firefox set as my default browser, I saw what
I saw. I realize now (looking back and re-testing [you're welcome]) that
IE and Opera deal with your code differently. It is clear to me that as
you "test locally" you avoid use of Mozilla browsers. If you try your
code in browsers besides IE you might see something like what I saw:
http://mypage.bluewin.ch/jlh/Mark.JPG

On which I based, along with some logic and mathematics, my next statement:
>>Aren't you aware that the "800px wide content" isn't likely to be 800px
except on a 40000px or wider display?

why are you giving me lectures? It seems you have no interest in trying to
answer my post, you just want to big yourself up by trying to correct me in
every instance
Believe me, I would never try to "big myself up". I get all kinds of
e-mails promising to let me do just that, and I delete them. :-)

It's not a lecture. But if you post to, say, alt.startrek, and talk
about Kirk wrestling with the Garn in the episode "Tomorrow is
Yesterday", somebody will reply that "Tomorrow is Yesterday" isn't the
episode you mean, you probably mean "Arena." Somebody else will probably
eventually come along and ask if you meant "Gorn" and just mis-typed. If
it's not a typo, you'll be better informed from the discussion, as will
many of the other participants and lurkers. IYSWIM.
>>>For reference assume the left bg image is like:
http://www.gdls.com/images/contacts/...alf_circle.gif and the right
like this: http://www.gdls.com/images/contacts/...alf_circle.gif

How about for reference we assume you copied and pasted without paying
attention? ;-)


sorry, you're wrong. The code I posted works EXACTLY as intended. I pasted
the same link twice(really sorry), but doesn't take a genuis to figure out I
made a typo given the image names are right there in the CSS
What do you mean, I'm wrong? If you had posted a URL we wouldn't have
this problem, but you gave us bogus info, which you now claim "works
EXACTLY as intended." But if the gifs are the same one it changes the
problem considerably. But I assumed you had just made a mistake, so I
included the winky. But you didn't catch that. But I don't care so much
anymore.
>>Anyway, I took a swing at what I thought you might really want, and I came
up with this (doctype HTML 4.01 strict, et. al. omitted):

img#foo { width:800px; height:1000px; }
#bgright { background: url(right_half_circle.gif) left top repeat-y; }
#bgleft { background: url(left_half_circle.gif) right top repeat-y; }
#stuff {width:800px; margin:.5em auto;

<div id="bgright">
<div id="bgleft">
<p id="stuff">My 800px wide content goes here
<img id="foo" src="foo.gif" alt="foo"></p>
</div>
</div>

well, that really is proof you didn't test my code(all you had to do was
copy and paste it into a HTML file and save the images).
Mark, this is where I really fly off the handle. All YOU had to do was
post a freaking URL. If it's so damn easy, YOU do it. And solve your own
damned problems, too, while you're at it.

For your information, I *DID* test it. I carefully copied your code to
my clipboard, opened up a new file on my desktop, pasted your code in,
added a doctype and <title>, saved the file, went to the desktop and
opened the file to view in my default browser, saw what a bloody mess it
was (not at *all* what you said you wanted), ran it through the
validator and considered the meaning of the errors it found, then
proceeding with resizing and scrolling tests. After which I developed
new code, testing as I went, to try and solve *your* problem. For free.
This is not at all what I wanted.
Oh, really? Gosh, I'm shocked. And after all the effort you went to to
explain it.
You've put the backgrounds at either side of the browser
window, far left and far right. The images themselves are unimportant(they
could be pictures of pigs on motorbikes). You could put a any image you want
there, the point is where the sit. In the sample code I gave the background
are fixed on either side of the content div, not on either side of the
browser window.
Let's review: In the sample code you gave there *was* no content div.
You provided no sample code with a div. You provided no URL with your
exact test case, with doctype, with content-type being served, with
actual images, or any other sign that you had actually tried out the
stuff you posted. I jumped to two conclusions: (1) that you, like so
many other posters here, had not been actually testing with the exact
code you typed or pasted into your post, and (2) that I probably wasn't
understanding your real problem (see my next line). I did my best with
what you provided, and if that's not what you wanted, you need to
clarify. Discovering your true inner needs is a job for you (and your
therapist), not me. All I can do is try to match the functionality of
the table you provided, which, as far as I can tell (even after studying
your post carefully and retesting [you're welcome again]), I believe I have.
>>I'm not even sure I've been addressing your real problem.

that's the only thing you've said in your whole post that I actually agree
with. Why do you have to be such an ass when responding? I would have
forgiven you if at the end you'd come up with a solution but you got it
totally wrong, telling my my code doesn't work when it actually does.
Oh, man. I don't like flame wars, and I really don't want to get into
one, although in your case I might make an exception. Maybe I'm more of
an ass when I respond when someone is an ass when they post. It
escalates, though, as I am sure you can see (or maybe you can't). I
guarantee you I have not turned on full Jukka mode yet so if you want to
respond in the same vein as your previous reply, we can play that way.

However, if you want to describe your problem in terms I can understand,
providing info accessible to all, you might get an answer which
satisfies you. It might even come from me, and it might even come in a
civil form. I try to be helpful, respectful and I post with my full real
name; that's my attempt to earn the right to post here. It's a great
place to learn, if you make an effort. I do. I hope my aggressive
response doesn't destroy the collegial atmosphere that can be so
attractive und useful here.

--
John
Mar 11 '07 #11

P: n/a
mark wrote:
"Rik" <lu************@hotmail.comwrote in message
news:op.tozbb2xpqnv3q9@misant...
mark <ma***@localhost.netwrote:
>>>>The site is 800px wide
>>That's beside the point. What he actually was telling you is that you
shouldn't have a fixed width.

I know exactly what he was telling me, totally beside the point. My sample
code didn't have a doctype either, surprised that wasn't pointed out aswell.
Actually, it was pointed out, but too subtly for you to notice. I didn't
want to make a big deal about it, since I was concentrating on your
stated problem. -sigh-
It was sample code, this is not a debate about fixed widths vs. percentage
widths.
If your problem turns out to be that you think you *need* fixed-width,
but can't achieve it, and upon discussion you find that you don't need
fixed-width after all, then a discussion would be beneficial to you (and
others).
>
>>What you are saying here is: I'm to lazy to do that work, so instead, I'll
make every single person trying to give me an answer do it over and over.
Now, that's inviting...

Lazy to upload it? I didn't upload because I cannot do that right now. I
created a code sample especially for testing purposes, would you rather me
link to a full site that has 1000's of lines of code that bare no relevance
to the problem so you have to go fishing through it? even if I did upload
it, whoever wished to help me would need to copy and paste the code, or save
it locally to test.
No, we don't want the full site, just the reduced test case.
I really do think you are making a big issue out of
this. I'm sorry for not being able to upload.
>><table>
<tr>
<td></td>
dome random content inside tr, outside any td
<td></td>
</tr>
</table>
Isn't exactly valid html.

where are you getting that from? It seems I missed a </tdby mistake but
shouldn't cause a problem for testing.
Yes, exactly. I think Rik missed reading a <tdby mistake. Your <table>
code in the OP was valid.
>
>>If both the left td and the right td are 49%, this means that even if we
have the middle td, this should actually be 2% of the tablewidth wide. If
you have an image 800px wide, you assume a width of the viewport of
40000px?

Did you test the code? the table has a width of 100%, it will only stretch
wider if the content of the cells pushes it wider. The fact that the middle
cell has a 2% width doesn't matter because the 800px content pushes it out
and pushes the 2 outer 49% cells smaller. It's used to keep the center cell
exactly in the center but always retaining a fixed width.
I *did* test the code (see my other post). The facts you claim here
apply only to certain browsers. The fact that you can claim a logical
oddity like 49% + 800px + 49% = [less than 40000px] and get a validation
of your claims from some excuse for a browser says a lot about the
quality of IE, and the problems of coding to one browser's quirks.
>>If you don't want any real answers, don't post. If you want people saying
'Oooh, you're so smart, what a briljant layout.' this is not te place for
it.

saying the width is going to be 4000px is not a real answer given the code
sample I gave does nothing of the sort. Tables just don't work like that. If
you define the width of a table as 100%, you can give cells widths of 10000%
and the table will not be wider than 100%. I assumed(perhaps wrongly) that
most people understood this.
More of the same.

--
John
Mar 11 '07 #12

P: n/a
mark wrote:
"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...

Here is what I see if I paste the code in my OP into a HTML file along with
the images:

http://img112.imageshack.us/my.php?i...icture2tm6.png (
http://img112.imageshack.us/img112/5360/picture2tm6.png )
Ooh, yummy! Images instead of code, imageshack instead of a real server
(pop-up ads don't endear me, somehow.)

More to the point: What's your point? What are you trying to communicate
to us? How is this different from what I provided (except that our
semi-circles are swapped)? And in
http://img112.imageshack.us/img112/5360/picture2tm6.png your "800px wide
content" is still not 800px wide. So I remain confused.
resized browser:

http://img294.imageshack.us/my.php?i...icture3dt4.png (
http://img294.imageshack.us/img294/4214/picture3dt4.png ) notice there are
no horizontal scrollbars.
What are these pictures? What do you mean "resized browser"? Do you just
mean sized differently from the previous two images?

In http://img294.imageshack.us/img294/4214/picture3dt4.png your "800px
wide content" is *still* not 800px wide. So I continue to remain confused.

Yeah, I see that there are no horizontal scrollbars in any of these
images. So what?
This is exactly what I want to achieve. Therefore you are wrong in saying
that my code is wrong, or that I didn't check my code before posted. I
suggest you get your facts straight before calling my out in such a way.
What is this, the Old West? I did not "call you out" and this is not
supposed to be some shootout in the middle of the street, as tumbleweeds
roll uncaringly past and ladyfolk scurry into Wilson's General Store for
cover. It's a newsgroup where technical issues regarding stylesheets are
discussed. Besides, I think I have my facts at least as straight you do.

--
John
Mar 11 '07 #13

P: n/a
Zilbandy wrote:
On Sat, 10 Mar 2007 14:57:53 -0000, "mark" <ma***@localhost.net>
wrote:
>>This is exactly what I want to achieve.

Then there is no need to continue this thread. :)
You know, I like the way you think. :-)

--
John
Mar 11 '07 #14

P: n/a
In article <45f2d7d3.0@entanet>, "mark" <ma***@localhost.net>
wrote:
even if I did upload
it, whoever wished to help me would need to copy and paste the code, or save
it locally to test.
This is not true. You have not heard of Firefox Developer
Extensions.

--
dorayme
Mar 11 '07 #15

P: n/a
In article <45f2cb5f.0@entanet>, "mark" <ma***@localhost.net>
wrote:
>
"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
mark wrote:
...ll possible you will
want to change the decoration, i.e., use some other image, like
squiggles.gif. In that case, "#bgleft" will be pretty silly.

why are you talking at me like I'm some kind of retard? I'm testing out a
layout, end of story.
I don't think he was talking to you as if you were a retard. Not
especially at least.

--
dorayme
Mar 11 '07 #16

P: n/a
"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
mark wrote:
Ooh, yummy! Images instead of code, imageshack instead of a real server
(pop-up ads don't endear me, somehow.)

More to the point: What's your point? What are you trying to communicate
to us? How is this different from what I provided (except that our
semi-circles are swapped)?
How can you not possibly see it's different? the very fact your sample had
the circles fixed at the edges of the browser window and mine has them fixed
on either side of the center cell/content. You have the code, and now images
and you still cannot understand what I wanted.
>And in http://img112.imageshack.us/img112/5360/picture2tm6.png your "800px
wide content" is still not 800px wide. So I remain confused.
that width of the white area in the center is exactly 800px. Measure it.
>resized browser:

http://img294.imageshack.us/my.php?i...icture3dt4.png (
http://img294.imageshack.us/img294/4214/picture3dt4.png ) notice there
are no horizontal scrollbars.

What are these pictures? What do you mean "resized browser"? Do you just
mean sized differently from the previous two images?
I mean it showes what happens to the background circles once the width of
the browser is reduced, I would have thought that was obvious. If this were
your sample the circles would remain fully visible due to the fact they are
attached to the edges of the browser window.
>Besides, I think I have my facts at least as straight you do.
you clearly don't
Mar 11 '07 #17

P: n/a
"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
>
I *did* test the code (see my other post). The facts you claim here apply
only to certain browsers. The fact that you can claim a logical oddity
like 49% + 800px + 49% = [less than 40000px] and get a validation of your
claims from some excuse for a browser says a lot about the quality of IE,
and the problems of coding to one browser's quirks.
lol, now you're saying I designed the table for 'IE quirks'...? You'll find
the table renders exactly the same in FF1-2, S1-2, IE 4-7, Opera 6-9,
Camino.... Hardly an IE quirk :-/ More like the way tables are designed to
work..

And it's not 49% + 800px + 49% at all, just shows what little you know about
tables. The table width is defined as 100%, this is key. And the cells
49%+2%+49% = 100%. It will always be at least 100% wide with a minimum width
of the content it contains, in this case 1px+800px+1px. The width of the
outer cells will be a minimum of 1px and a maximum of 49% of the table
width. The width of the center cell will either be 800px or 2%, whichever is
greater.
Mar 11 '07 #18

P: n/a

"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
>
My problem, mate, is that I tried to help you, and you chose (a) to make
it difficult to help you, and (b) to insult me when I did.
I insulted you? ....that's take some quotes from your initial reply shall
we:
>"#bgleft" will be pretty silly
>Wait a minute; if you *were*... it *would*...? Awfully conditional words
>Is that why you didn't provide a URL? Because you don't have actual code
you're trying to "convert"?
>Is it because the code isn't actual (but merely typed in to your post on
the fly) that the code above doesn't do what you claim you want it to
do?
>How about for reference we assume you copied and pasted without paying
attention? ;-)

Wouldn't it have just been easier to say, 'Can you please post a URL, I
can't help you until you do'...?
I didn't "wish to test it," but you asked for help, and when a brother
needs help, I like to be able to provide it. Your post was just sitting
there unanswered for an hour, so I went the extra distance. Your welcome.
You didn't help me at all, just wasted my time and yours by being so rude.
By the way, as Rik has pointed out, copy-and-paste is more trouble than
some problems are worth for some people, so you reduce the quantity of
help you might get. Besides which, if it's so damn easy to do it, why
don't *you* do it? It's "all you have to do."

If *you* can't be bothered doing the minimum work, why should each of us?
Settings up a server/host is easier than copying and pasting into a text
file? Look, I quite understand you don't like to help without a sample URL,
that's fair enough. I will not post here without one again. OK?
[OP's CSS and my advice about class names snipped]
>why are you talking at me like I'm some kind of retard? I'm testing out a
layout, end of story. I'm sorry if you don't like the way I'm named my
IDs.

It's the "end of story" if you keep testing locally and don't ask for help
in a public NG. If you post to usenet you run the risk of having your code
discussed publicly, by people who know much, much more than you (the
advantage of Usenet) as well as by people with less of a clue (the
disadvantage of Planet Earth). My remarks were meant as helpful tips.
What I find funny is that you're trying to give me tips on things I didn't
even ask for! For you to tell me how I should be doing a certain thing when
I'm merely testing is not needed and not relevant to the problem in hand.
I'm working a test file, I didn't think twice about the width of the class
names because they do not matter at all as regards the problem I'm trying to
solve.

[OP's code snipped]
>>>Is it because the code isn't actual (but merely typed in to your post on
the fly) that the code above doesn't do what you claim you want it to do?

I'm sorry, but it does. I tested it before putting it into the post. I've
also used this type of layout many times before. I find it funny that you
tell me my code doesn't do what I already know it does. More like you
don't actually understand what I want.

I'm sorry, but it doesn't. I didn't copy and paste your code and then test
in IE. Because I have Firefox set as my default browser, I saw what I saw.
I realize now (looking back and re-testing [you're welcome]) that IE and
Opera deal with your code differently. It is clear to me that as you "test
locally" you avoid use of Mozilla browsers. If you try your code in
browsers besides IE you might see something like what I saw:
http://mypage.bluewin.ch/jlh/Mark.JPG
oh jeez, the only reason that is happening is because you have no 'foo.gif'.
I would have thought that was pretty clear, especially to an 'expert' like
yourself!!! Second of all, like I said in my response to your initial
replay, the 800px width matters not, it's the way the backgrounds are
aligned to the outside of the center cell. As the above image shows exactly.
The code works percectly, the only problem you're seeing is that Mozilla and
Opera are not honouring the width of the broken image.

Second of all, considering I'm testing on a mac, why do you keep assuming
I'm ONLY using IE? I find that rather funny, I even posted screenshots of
Safari.

<snip rest of lecture>
Mar 11 '07 #19

P: n/a
mark wrote:
"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
>>mark wrote:

that width of the white area in the center is exactly 800px. Measure it.
I did, both images. Trust me.
I do not foresee attempting to communicate with you again. HAND

--
John
Mar 11 '07 #20

P: n/a
mark wrote:
"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
>If *you* can't be bothered doing the minimum work, why should each of us?

Settings up a server/host is easier than copying and pasting into a text
file?
We don't care how difficult it is for *you*. We care about how difficult
it is for *us*. If you want help, you should make it as easy as possible
for us to help you. Posting a URL is the way.
Look, I quite understand you don't like to help without a sample URL,
that's fair enough. I will not post here without one again. OK?
I'm wondering what incentive we have to give you any assistance at all
if you're just going to be argumentative about everything? Your attitude
leaves something to be desired.
What I find funny is that you're trying to give me tips on things I didn't
even ask for!
Welcome to Usenet. This is a discussion group, so we discuss things. It
is not a help desk. It is not unusual to point out poor coding or design
practices when we see them. If we happen to give you the answer you were
originally seeking, consider it a bonus.

--
Berg
Mar 11 '07 #21

P: n/a
In article <45f3ec6d.0@entanet>, "mark" <ma***@localhost.net>
wrote:
Wouldn't it have just been easier to say, 'Can you please post a URL, I
can't help you until you do'...?
Maybe it would have. But these are not magic words and could
easily have been answered with a storm of protest by you. Since
old John has now had enough of you, would you mind carrying on a
bit of flaming with me. I like it you see. One way to distract
myself is always as good as any other really... I want you to
think of horrible cutting things and we can take it from there...

--
dorayme
Mar 11 '07 #22

P: n/a
"dorayme" <do************@optusnet.com.auwrote in message
news:do**********************************@news-vip.optusnet.com.au...
In article <45f3ec6d.0@entanet>, "mark" <ma***@localhost.net>
wrote:
>Wouldn't it have just been easier to say, 'Can you please post a URL, I
can't help you until you do'...?

Maybe it would have.
right, really that's all it needed. Instead of the patronising BS
But these are not magic words and could
easily have been answered with a storm of protest by you.
I wouldn't have protested, but if you read John's response to my OP it
really is rather rude, making a lot of false assumptions. I will not post
here for CSS help again, it's that simple.
>Since
old John has now had enough of you, would you mind carrying on a
bit of flaming with me. I like it you see. One way to distract
myself is always as good as any other really... I want you to
think of horrible cutting things and we can take it from there...
I suggest if you like these type of arguments you post here under another
name and not post a URL, I'm sure John will be all too happy to assist you
in your quest for a bit of 'flaming' ;-)
Mar 12 '07 #23

P: n/a
"Bergamot" <be******@visi.comwrote in message
news:55*************@mid.individual.net...
mark wrote:
>"John Hosking" <Jo**@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
>>If *you* can't be bothered doing the minimum work, why should each of
us?

Settings up a server/host is easier than copying and pasting into a text
file?

We don't care how difficult it is for *you*. We care about how difficult
it is for *us*. If you want help, you should make it as easy as possible
for us to help you. Posting a URL is the way.
Fair enough, like I said in another post. If this is the case all was needed
to be said was 'Can you please post a URL, otherwise we can't help you'
That's it.

Instead I get all this nonesense.....
>"#bgleft" will be pretty silly
>Wait a minute; if you *were*... it *would*...? Awfully conditional words
>Is that why you didn't provide a URL? Because you don't have actual code
you're trying to "convert"?
>Is it because the code isn't actual (but merely typed in to your post on
the fly) that the code above doesn't do what you claim you want it to
do?
>How about for reference we assume you copied and pasted without paying
attention? ;-)

Just un-needed and wrong, it's no wonder this thread turned out the way it
did with such a response.

>Look, I quite understand you don't like to help without a sample URL,
that's fair enough. I will not post here without one again. OK?

I'm wondering what incentive we have to give you any assistance at all
if you're just going to be argumentative about everything? Your attitude
leaves something to be desired.
If you read the thread from start to finish, you'll see my post was answered
IMO rather rude.
>What I find funny is that you're trying to give me tips on things I
didn't
even ask for!

Welcome to Usenet. This is a discussion group, so we discuss things. It
is not a help desk. It is not unusual to point out poor coding or design
practices when we see them. If we happen to give you the answer you were
originally seeking, consider it a bonus.
It's not a bonus at all, it's akin to posting a message on a web authoring
group concerning a Flash problem. There's always going to be people who
rather than answer your query will question your decision to even use Flash
in the first place. As was the case here with a fixed px layout. I've heard
it all before and it was totally irrelevant to the problem at hand. Hence
the reason I don't appreciate the advice, to assume I don't know the pros
and cons of a fixed vs elastic layout is poor game.
Mar 12 '07 #24

P: n/a
In article <45f4a1ab.0@entanet>, "mark" <ma***@localhost.net>
wrote:
Fair enough, like I said in another post. If this is the case all was needed
to be said was 'Can you please post a URL, otherwise we can't help you'
That's it.

Instead I get all this nonesense...
It is not always an easy thing to judge, to go ahead and give
practical advice about something that one has misgivings about in
the first place or to simply stay out of it. Sometimes one
stumbles on ... (as did John) and it is not always well received.
Perhaps you are a perfectly normal earthling and do not
understand that we here have no other outside life and cannot
keep out of too much otherwise we face the creepiest alternative
of all.. total and self-conscious solipsism, a fate worse than
death.

--
dorayme
Mar 12 '07 #25

P: n/a
mark wrote:
>
like I said in another post. If this is the case all was needed
to be said was 'Can you please post a URL, otherwise we can't help you'
That's it.
Um, your words, after the first response to your original query:
Mate, what is your problem? I didn't provide a URL because I'm testing
locally. I've provided sample code, really sorry if it's not good enough for
you. If you wish to test it, then all you have to do is copy and paste and
save the images I linked.
You ignored all requests to post a URL. Sorry you couldn't be bothered.
Instead I get all this nonesense.....
You really need a thicker skin if you're going to play in Usenet.
Frankly, I'm mighty tired of newbies who don't bother learning the
conventions of the newsgroup they are posting to, then getting all
defensive and arguing about things when they don't like what they hear.
You aren't the first, nor will you be the last. <heavy sigh>
There's always going to be people who
rather than answer your query will question your decision to even use Flash
in the first place. As was the case here with a fixed px layout. I've heard
it all before and it was totally irrelevant to the problem at hand.
I guess you didn't hear the part about this being a discussion group,
not a help desk. Shall I repeat it?
Hence
the reason I don't appreciate the advice, to assume I don't know the pros
and cons of a fixed vs elastic layout is poor game.
Arrogance will get you nowhere, except kill-filed.

--
Berg
Mar 12 '07 #26

P: n/a
On Mar 11, 7:59 am, John Hosking <J...@DELETE.Hosking.name.INVALID>
wrote:
mark wrote:
"John Hosking" <J...@DELETE.Hosking.name.INVALIDwrote in message
news:45**********@news.bluewin.ch...
>mark wrote:
that width of the white area in the center is exactly 800px. Measure it.

I did, both images. Trust me.

I do not foresee attempting to communicate with you again. HAND

--
John
I'm not surprised. Tested the html in the OP, got the same
results, including behaviour on resizing the browser to smaller
than 800px, on every one I tested: IE7,FF,Opera,NN

Measured images, white area=800px.

In other words, I fail to see why mark was jumped on. He gave
HTML that worked cross-browser and asked for help converting
it to a css-based presentation. Instead he gets told that his
HTML doesn't work, WTF?

I only browsed this NG looking for a place to post css questions
but this obviously ain't the place to go. Ciao.

Mar 15 '07 #27

This discussion thread is closed

Replies have been disabled for this discussion.