Re: Struggling to convert this layout into CSS
- From: John Hosking <John@xxxxxxxxxxxxxxxxxxxxxxxxxxx>
- Date: Sun, 11 Mar 2007 01:39:11 +0100
mark wrote:
"John Hosking" <John@xxxxxxxxxxxxxxxxxxxxxxxxxxx> wrote in message news:45f2b0fe$1_2@xxxxxxxxxxxxxxxxxx
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/left_half_circle.gif and the right like this: http://www.gdls.com/images/contacts/left_half_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
.
- Follow-Ups:
- References:
- Struggling to convert this layout into CSS
- From: mark
- Re: Struggling to convert this layout into CSS
- From: John Hosking
- Re: Struggling to convert this layout into CSS
- From: mark
- Struggling to convert this layout into CSS
- Prev by Date: Re: Struggling to convert this layout into CSS
- Next by Date: Re: Struggling to convert this layout into CSS
- Previous by thread: Re: Struggling to convert this layout into CSS
- Next by thread: Re: Struggling to convert this layout into CSS
- Index(es):
Relevant Pages
|
