13 replies [Last post]
VICKY57
Offline
newbie
Last seen: 12 years 37 weeks ago
Timezone: GMT+8
Joined: 2009-05-05
Posts: 6
Points: 0

What I'm after is I'm trying to get my book girl
http://www.geocities.com/b39587169/index.html
to vertically center proportional to the height of the text block "TFRAME" in my book blog . . . whatever height that text block renders in.

Can this even be done? I'm trying to achieve (what I think is called) a "liquid" layout -- in other words, the images maintain their porportionality as the browser window resizes.

Thanks, and I'm sure the rest of my code is a disaster but it did verify lol.

VICKY

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 46 weeks 1 day ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

More info?

Where does lady go? To the left or right of that text block? Please elaborate.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

VICKY57
Offline
newbie
Last seen: 12 years 37 weeks ago
Timezone: GMT+8
Joined: 2009-05-05
Posts: 6
Points: 0

Hi Gary. The effect (for

Hi Gary. The effect (for this one row) I'm trying to achieve is best described in terms of what I would get with a table: 1-Row/2-Columns; Left Cell (my booklady) vertically-aligned MIDDLE; Right Cell (TFRAME) vertically-aligned TOP. I'm hoping for a way for my booklady to inherit whatever height TFRAME ends up being, and then align her to its center. I do not want TFRAME to wrap around her; she needs to effectively occupy her own column; and she sits to the left of TFRAME.

I could just do this with a table, except that my booklady needs to automatically resize with the browser window, and the whole thing needs to be IE friendly for the exactly three people still using older versions of Explorer heh heh.

I don't even know if this can be done, but if there's a CSS method of duplicating vertical alignment for images sitting next to text DIVS, that is what I am after. Also, any tutorials that specifically address "dual-content" layout (image on same row as text) would be greatly appreciated. Thanks Gary!

Vicky

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 46 weeks 1 day ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

First, resizing the image is

First, resizing the image is a not-good idea. So I didn't do that. Try this:

  #row2 {
    background: transparent url("test_files/VICKY.gif") 0 50% no-repeat;
    }
 
  #row2 div {
/*    float: left;
    width: 100%;
*/    }
 
  #tframe {
    margin-left: 200px;
    }
=============
    <!-- ROW 2 -->
 
    <div id="row2">
   <!--   <img src="test_files/VICKY.gif"
           style="width: 20%;"
           alt="" />
-->
      <div id="tframe">
 
<!-- width attribute deleted -->
        <div style=
        "border: 0px solid rgb(170, 170, 184); padding: 2%; background-color: rgb(226, 226, 216);">
        <div style=
        "border: 0px solid rgb(0, 0, 0); padding: 4%; width: 92%; background-color: rgb(255, 255, 255); color: rgb(0, 0, 0);">
...
The "Welcome to ..." should be marked as a heading. Lose the s. Use the

tag to delimit paragraphs.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

VICKY57
Offline
newbie
Last seen: 12 years 37 weeks ago
Timezone: GMT+8
Joined: 2009-05-05
Posts: 6
Points: 0

Hi again Gary. Okay my

Hi again Gary. Okay my latest attempt, following (most heh) of your recommendations is here:
http://www.geocities.com/b39587169/BOOKGIRL9.html
I really don't want to define her in pixels if I can help it; I'd like to stick with %s.

I altered the relevant lines of code as follows:

#ROW2 {background: transparent url("http://www.geocities.com/b39587169/VICKY.gif") 0 50% no-repeat;}
#ROW2 div {
/*    float: left; width: 100%;
*/    }
 
#TFRAME {margin-left: 25%;}

and

<div id="TFRAME">
<div style="border: 0px solid rgb(170, 170, 184); padding: 2%; background-color: rgb(226, 226, 216);">
<div style="border: 0px solid rgb(0, 0, 0); padding: 4%; width: 92%; background-color: rgb(255, 255, 255); color: rgb(0, 0, 0);">
 
<span style="color: rgb(85, 85, 119);">
Welcome to Vic~

There are a couple of problems with this workaround, one major:
Bookgirl needs to be able to resize with the browser window (shrink/expand). The solution you have provided renders her image fixed, and you'll note I had to increase TFRAME's left margin to compensate for this. It was kinda fun watching her "disappear" behind TFRAME as I resized the window, but that's not the effect I was after.

The other issue is (what else) IE weirdness:
For some unknown reason, applying this workaround appears to throw ROW1 (the book wings) . . . in IE only.

I'm really hoping I won't have to use a table on ROW2!! :jawdrop: but if I'm going to forfeit the image liquidity inherent to

s, I might as well just throw a table up there. :shrug:

VICKY

VICKY57
Offline
newbie
Last seen: 12 years 37 weeks ago
Timezone: GMT+8
Joined: 2009-05-05
Posts: 6
Points: 0

I'll post a screenshot of

I'll post a screenshot of what I'm getting in IE with BOOKGIRL9 so you can see what I'm looking at. I'm going to play around with ROW1's numbers a bit first, however, and see if I can't get these horses back in the barn.

V

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 46 weeks 1 day ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

Let me reiterate: it is a

Let me reiterate: it is a bad idea to scale images. the Image has an implicit width and height in pixels. To scale is to degrade the image quality. That's why I set the tframe margin in pixels, and I strongly recommend you do the same.

Next, I suggest you re-mark the text to reflect its semantic values, e.g. headings and paragraphs, and correct your markup errors. Some, you can't fix because your host adds stuff to your page. Fortunately, geocities is closing shop, so everybody benefits.

There are other structural improvements to be affected, especially to accommodate IE.

Let's get first things first.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

VICKY57
Offline
newbie
Last seen: 12 years 37 weeks ago
Timezone: GMT+8
Joined: 2009-05-05
Posts: 6
Points: 0

I don't have markup errors;

I don't have markup errors; the code validates; I have no idea what you're referring to.

Sigh. The reason I don't use

's is because I'm hypersensitive to (what we call in typography) the "letting" inherent to the

tag: I prefer tight letting. That is my prerogative, isn't it? tags don't conflict with the browser . . . or do they? If you are telling me that a

tag has material significance to a browser's capacity to render, then that puts your argument in a different light completely (for me).

It also means that, if I am to have to jump right in and use

tags everywhere, then -- before I can even begin to see my page just simply laid out the way I want it to be; however deviant it is in its current rough state from the coding conventions you're so critical of -- then I have to devote time to learning how to reverse the "flabby" letting of a

tag.

. . . which is now getting into stylizing text with CSS.
. . . Which is something this full-time insurance broker hoped to be able to learn after I just simply got my page to layout the way I want it. After; not before. If it has relevance to the browser's positioning of elements, so be it. I haven't read anything to suggest that, and I'll seriously consider your explanation. So far it looks to me like we're building . . . a table. :shrug:

V

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 46 weeks 1 day ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

VICKY57 wrote:I don't have

VICKY57 wrote:

I don't have markup errors; the code validates; I have no idea what you're referring to.

Your code may have correct syntax, but your host adds a bunch of crap that doesn't. A broken syntax in the html can affect the rendering in other parts of the document. See w3 validator.

Quote:

Sigh. The reason I don't use

's is because I'm hypersensitive to (what we call in typography) the "letting" inherent to the

tag: I prefer tight letting. That is my prerogative, isn't it?

In css, the term is line height. It isn't quite as flexible as the printer's leading, being always split 50-50 above and below the text. The default values for your declared 'medium" font-size are 16px font size, 1.2× or 1.25× the font size (19 or 20px total line height. Let's assume a 16px font size, a line height of 1.25× (20px), and top and bottom margins on a

of 1.25em (20px).

In that case, each line of text measures 20px from baseline to baseline. When you throw in two s, that adds an empty 20px high line. With the

tag, the line spacing is the same, and the top and bottom margins collapse, leaving an empty 20px, the same as the double s did.

Quote:

tags don't conflict with the browser . . . or do they? If you are telling me that a

tag has material significance to a browser's capacity to render, then that puts your argument in a different light completely (for me).

From the standpoint that the

tag describes what the content is, and the has no semantic value, and from the standpoint that the

offers a css hook that you can use for styling and for DOM scripting. You cannot do that with

Quote:

It also means that, if I am to have to jump right in and use

tags everywhere, then -- before I can even begin to see my page just simply laid out the way I want it to be; however deviant it is in its current rough state from the coding conventions you're so critical of -- then I have to devote time to learning how to reverse the "flabby" letting of a

tag.

Compare this well structured, semantic markup to yours. Then compare the presentational possibilities. Notice the first paragraph is normal leading and margins. The second has increased leading and the third and fourth have reduced leading.

  #tframe {
    margin-left: 200px;
    }
 
#tframe div {
    background-color: white;
    border: 10px rgb(226, 226, 216) solid;
    color: rgb(85, 85, 119);
    padding: 10px 20px;
    }
 
#tframe h1 {
    font-size: 1em;
    }
 
#tframe p.tight {
    line-height: 1;
    }
 
#tframe p.loose {
    line-height: 1.5;
    }
 
#tframe p.tootight {
    line-height: .6;
    }
==================
      <div id="tframe">
        <div>
          <h1>Welcome to Vicky’s World</h1>
 
          <p>The primary reason for creating this little pocket of
          tranquility is to share my thoughts about books and authors.
          In real life I’m a CA State Licensed Life Insurance Agent,
          fifty-something and a widow. I adopted the nickname “Vicky”
          largely because the graphic appearance of this site has a
          decidedly Victorian theme.</p>
 
          <p class="loose">My taste in fiction is usually, but not
          always, set in time periods prior to the 20<sup>TH</sup>
          Century. There are complicated reasons for my preference in
          historical fiction (and you can glean some of the more
          private ones <a href="#DEPRESSION">here</a>) but on a
          practical level, I find that — for mysteries, in particular —
          technology has a severely emasculating effect on both
          conflict and suspense. Oh, I enjoy a good modern-day thriller
          as much as the next person, but there is something lost to
          the intensity of conflict when technology substitutes for
          what used to be human endeavor. It is the same case with B/W
          Film Noir: the mysteries contained in its shadows are
          compromised in subtle ways upon introducing harsh lighting
          and color to a previously greyscale image. Of course this has
          nothing whatsoever to do with my being “a woman of a certain
          age.”
          <br />
          <span class="smallcaps">(yes, well ….)</span></p>
 
          <p class="tight">The fact is there remains a natural
          relationship to period fiction and B/W Film Noir that I
          typically take as my metaphor when describing why I prefer my
          mysteries to take place in the dark, seamy underworld of a
          Whitechapel rookery — indeed, there is an abundance of
          London, England on my bookshelves; so if you were looking for
          everything from Dalziel &amp; Pascoe to Sherlock Holmes, you
          may find my reviews helpful. I am an unrepentant Anglophile
          (although I do hop the pond and escape to France and Arabia
          every now and then heh). Here in the States our lack of
          variety is not due to any absence of talent so much as our
          woefully limited history: We’re simply too new (we’re also
          both too efficient and too innovative for the purposes of
          literary conflict but I digress). Any english-speaking nation
          with a couple thousand more years’ worth of history would
          probably suffice for my preferences, although by now my
          affection for British mysteries is so rooted in my psyche
          you’d have to drag me kicking and screaming from the
          rookeries of Seven Dials (as just one example) where I’ve
          escaped with enough highwaymen, blackmailers, thieves,
          murderers, and Bow Street Runners to be hard pressed to find
          a warren of rat-infested alleyways as exquisitely dangerous.
          Does this mean I simply spurn American Historicals?
          <em>Never!</em> and thus you will also find the best domestic
          historicals I’ve run across. They’re typically set around the
          Revolutionary War and the Civil War, but not always.</p>
 
          <p class="tootight">In closing let me say that I have to make
          a living while building this site. Portions of the site may
          remain under construction for months (if not years) so please
          leave your calling card. And know how flattered I am that
          you’ve taken the time to visit me, and are willing to be
          patient while I navigate the intersection of HTML, CSS … and
          the one activity that has lifted me from despair more times
          than I can count, <em>reading a really good book.</em></p>
 
          <p>Vicky
          <br />
          May 2009</p>
        </div>
      </div>

Quote:

. . . which is now getting into stylizing text with CSS.
. . . Which is something this full-time insurance broker hoped to be able to learn after I just simply got my page to layout the way I want it. After; not before. If it has relevance to the browser's positioning of elements, so be it. I haven't read anything to suggest that, and I'll seriously consider your explanation. So far it looks to me like we're building . . . a table. :shrug:

V

One of the most difficult things to wrap your mind around as you move from table layout to css layout is that you must first (re)learn to mark up your document with well structured, semantic and valid markup. No non-trivial table can be well structured or semantic, though it can be valid. Don't try to ease into it. The foundation work is totally different.

The visual result may look the same as you'd get with a table, but the underlying html is completely different. Consider the problem of moving the lady from the left side to the right. In a table layout, you'd have to rewrite the html on every page. With a well structured html plus css, all you'd do is set the image to right, and #tframe's margin would be right instead of left. Two lines of css vs what with tables?

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Stomme poes
Stomme poes's picture
Offline
Elder
Netherlands
Last seen: 10 years 12 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

Quote:stylizing text with

Quote:

stylizing text with CSS. . . . Which is something this full-time insurance broker hoped to be able to learn after I just simply got my page to layout the way I want it. After; not before.

If learning CSS (which means learning HTML then as well) is something you'd like to do, but want this layout "done" soon, the other possibility is having someone do it for you (ie, hiring someone) and possibly, if they are good at explaining, have them write out what they did and why for you to study later. Otherwise, know that to do this right (what's the point of doing anything half-right? unless it's fun to do it so) starting from near the beginning will take quite a bit of time.

It's worth it, IF this is something you want to learn in order to make more websites or maybe even do it as a (2nd) job or something.

Call me stupid, but I'd say it took me a good 2 years to learn what I would call the "basics" of HTML/CSS. Still learning too, of course.

If you take the red pill, the crusty gurus here will lead you through the learning curve, but it is a learning curve.

What do you want to do?

I'm no expert, but I fake one on teh Internets

VICKY57
Offline
newbie
Last seen: 12 years 37 weeks ago
Timezone: GMT+8
Joined: 2009-05-05
Posts: 6
Points: 0

Gary, the added host

Gary, the added host scripting has no relevance to this page -- I can drop the html into Dreamweaver and I assure you the effect is identical when viewed locally. I'm not trying to be argumentative -- and I do certainly take your point viz Geocities -- but it simply doesn't apply to this one page. Incidentally, I have no love of Geocities heh. I've got a berth prepared at Google sites but their servers are so overwhelmed right now as they migrate from Google Pages (and handle the 'hoo exodus) that I can't get (any) html into even one page. It simply crashes. If you know of a better free solution to put my little books site, I welcome any suggestions. I've looked into Wordpress but can't figure out how to get rid of that antideluvian needlessly-narrowed center-column/fixed layout of theirs.

My pages, when done, are going to be ((W.I.D.E.S.C.R.E.E.N...R.E.A.D.Y)), and the images on it (God willing heh) displaying proportional to the user's browser. }:) They'll shrink proportionally when/if printed, as well (to fit user's print settings). Right now I'm viewing this page on my NEC 24" Widescreen . . . in Portrait Mode. A luxurious 1200 x 1900 pixels' worth of news spills down from the top of my monitor, and my index finger is at last reprieved from typically 80% of the insidious scrolling-down I used to do with my old 22" CRT.

But I am eccentric (no! Gary never would have guessed!! ha ha) and fully aware that most widescreen owners use their monitors in Landscape Mode. Other than its obvious advantage when viewing spreadsheets, I can't understand why anyone would want to surf the web in Landscape mode but . . . whatever. I digress because this issue of technology moving into a "Widescreen World" is material to my concept of "elastic" widths when coding a tableless page that contains images. This is the reason I will not accept a solution that deprecates the utility of some of my larger images to a fixed-size display. Small navigational images I have no problem with; but as column widths expand/shrink, so shall my decorative images.

Now I want to reply to one other issue you've brought up twice now, and that is the advantage CSS offers to "boilerplate" layout settings for multiple use. I am in total agreement with you that this is an obvious choice for the commercial site owners with hundreds (thousands) of pages. That, of course, is not me. It doesn't alter the value of the concept; but it does give me the luxury of doing exotic things that aren't obliged to conform to any particular coding/scripting standard. For all I know, the solution to what I need for one particular page might end up being in PHP. :shrug: The blasphemous thought that I might escape the paradigm and do for just one page what I probably wouldn't do anywhere else is fine with me: This is a little collection of thoughts about books. I'm not mass-producing content; each of these pages is an intimate, sometimes private journey into the mind of a very private woman. I will add pages at my leisure and apologize to no one for either the content or the speed with which I supplement it.

Proportional-image display is (apparently) either something that you personally do not know how to do, or know but just won't disclose. Your priority is for me to conform my typography to web standards, but that isn't my priority. I will achieve the effect I want on the layout of this page first, with or without your help. Time being pressing, as 'hoo shuts down, I'm somewhat anxious about this layout issue and your repeated entreaties to engage me in the (huge) learning curve that is CSS type styling will not change the fact that I just won't go there until I've buttoned this issue down first.

Now that we've managed to position her relative to the height of TFRAME, if you know how to get my booklady to display proportional to the browser window, please share the solution now. If you help me to get her image to resize, I will spend some serious time conforming the source code to the web standards you've urged. I do so grudgingly but it's only fair to accord you the respect you deserve for helping me.

And, Gary -- even if you don't know of a solution to this, that's okay too. There are dozens of forums out there, and I'll visit as many of them as I need to (and as time permits heh) to have this pursuit settled one way or the other. I've learned a very important strategy re vertical positioning in CSS and I have you to thank for this. This is a wonderful forum, btw. God knows I'll be needing it if you actually do solve my bookgirl issue, and then have no excuse for my procrastination heh heh.

VICKY

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 46 weeks 1 day ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9776
Points: 3858

VICKY57 wrote:Gary, the

VICKY57 wrote:

Gary, the added host scripting has no relevance to this page -- I can drop the html into Dreamweaver and I assure you the effect is identical when viewed locally. I'm not trying to be argumentative …

It does indeed affect rendering in IE6 due to host added markup.

Quote:

My pages, when done, are going to be ((W.I.D.E.S.C.R.E.E.N...R.E.A.D.Y)), and the images on it (God willing heh) displaying proportional to the user's browser. }:) They'll shrink proportionally when/if printed, as well (to fit user's print settings). Right now I'm viewing this page on my NEC 24" Widescreen . . . in Portrait Mode. A luxurious 1200 x 1900 pixels' worth of news spills down from the top of my monitor, and my index finger is at last reprieved from typically 80% of the insidious scrolling-down I used to do with my old 22" CRT.

1200px width is fairly standard for 17in+ monitors. Even that small enlargement of your images introduces ugly artifacts. Viewing at 1920px width is damned near painful.

Quote:

But I am eccentric (no! Gary never would have guessed!! ha ha) and fully aware that most widescreen owners use their monitors in Landscape Mode. Other than its obvious advantage when viewing spreadsheets, I can't understand why anyone would want to surf the web in Landscape mode but . . . whatever.

I can't understand anyone with a large monitor running their browser maximized. I take advantage of the wide screen to have several windows open and in view. That there are bigger desktops doesn't imply that the telephone, pen holder, and notepaper have to be larger.

Quote:

I digress because this issue of technology moving into a "Widescreen World" is material to my concept of "elastic" widths when coding a tableless page that contains images. This is the reason I will not accept a solution that deprecates the utility of some of my larger images to a fixed-size display. Small navigational images I have no problem with; but as column widths expand/shrink, so shall my decorative images.

The problem, and thus my opposition to variable sizing of images, is that browsers are lousy image manipulation programs. Any enlarged raster image will fall apart. Vector graphics can be scaled, but IE does not support them. Shrinking the image is less awful, but browsers do it poorly. Even Photoshop is less than exemplary at scaling down. Imagemagick does a better job than PS, but browsers aren't even in the game.

Quote:

Now I want to reply to one other issue you've brought up twice now, and that is the advantage CSS offers to "boilerplate" layout settings for multiple use. I am in total agreement with you that this is an obvious choice for the commercial site owners with hundreds (thousands) of pages. That, of course, is not me. It doesn't alter the value of the concept; but it does give me the luxury of doing exotic things that aren't obliged to conform to any particular coding/scripting standard. For all I know, the solution to what I need for one particular page might end up being in PHP. :shrug: The blasphemous thought that I might escape the paradigm and do for just one page what I probably wouldn't do anywhere else is fine with me: This is a little collection of thoughts about books. I'm not mass-producing content; each of these pages is an intimate, sometimes private journey into the mind of a very private woman. I will add pages at my leisure and apologize to no one for either the content or the speed with which I supplement it.

I don't believe I said anything about "boilerplate" design or dealing with a potload of pages. Don't extend my comments. I used a simple example of the advantages of good html plus css vs table layout. The example applies to any number of documents. HTML plus css is easier and faster to build from scratch, its easier and faster to maintain, and it's easier and faster to re-position. Like most of us who've been doing this stuff since before the tipping point (2003–2005), I've done table layouts too. There is no question that table layout is not the road to go down.

Using php does not affect the requirement for proper html+css.

Quote:

Proportional-image display is (apparently) either something that you personally do not know how to do, or know but just won't disclose.

That's an obnoxious statement. See my 2003 demo from wayback machine, and my 2004 demo from wayback machine.

Background images cannot be stretched. I went that route because IE requires extraordinary effort to get vertical centering, and you were already arguing every point.

Quote:

Your priority is for me to conform my typography to web standards, but that isn't my priority. I will achieve the effect I want on the layout of this page first, with or without your help. Time being pressing, as 'hoo shuts down, I'm somewhat anxious about this layout issue and your repeated entreaties to engage me in the (huge) learning curve that is CSS type styling will not change the fact that I just won't go there until I've buttoned this issue down first.

The web is not print. They have different capabilities and handicaps. Among them, where graphics are concerned, is screen resolution vs print resolution; 72–100 ppi web vs 300–1200+dpi print.

Quote:

Now that we've managed to position her relative to the height of TFRAME, if you know how to get my booklady to display proportional to the browser window, please share the solution now. If you help me to get her image to resize, I will spend some serious time conforming the source code to the web standards you've urged. I do so grudgingly but it's only fair to accord you the respect you deserve for helping me.

There are two examples above showing how to scale the image. See centering inline elements and inline-block galleries. The latter will show you how to make the tframe act inline for the former demo.

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

ABCruz
ABCruz's picture
Offline
Enthusiast
Pilipinas
Last seen: 7 years 37 weeks ago
Pilipinas
Timezone: GMT+8
Joined: 2005-06-16
Posts: 279
Points: 0

Just a bit of

Just a bit of clarification:

Quote:

...it does give me the luxury of doing exotic things that aren't obliged to conform to any particular coding/scripting standard. For all I know, the solution to what I need for one particular page might end up being in PHP.

PHP is a server-side scripting language. It allows designers to automatically/dynamically generate code, written in XML|HTML|CSS|JavaScript|etc., for client-side use. But don't be misled by "dynamically generated", PHP doesn't weave the code out of thin air.

The PHP programmer, in some cases has to write templates that are written in the languages mentioned; while in some cases, the programmer works with another specialist, i.e. a web designer who works on HTML and CSS. So yes, as Gary said, "using php [asp, jsp, perl, or python] does not affect the requirement for proper html+css."

=)
Arielle

I am a Man of Truth.
I am a Free Human Person.
I am a Peacemaker.

http://www.abcruz.com

Stomme poes
Stomme poes's picture
Offline
Elder
Netherlands
Last seen: 10 years 12 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2008-02-04
Posts: 1854
Points: 378

gary wrote:I can't

gary wrote:

I can't understand anyone with a large monitor running their browser maximized. I take advantage of the wide screen to have several windows open and in view. That there are bigger desktops doesn't imply that the telephone, pen holder, and notepaper have to be larger.

Ah, I'm a full-screen user. All my open programs are tabs at the bottom. The only application I have multiple smaller windews laying around in is with GIMP.

Maybe to scale this image, Vicky should just use an SVG and to hell with IE? Or maybe do what Wikipedia does (dunno how they do it): svg's go to smarter browsers, and when the browser can't handle it, gets nameoffile.svg.png instead. Though, actually, a scaling svg... only works in like Opera, right?

Using the ZOOM property on browsers like FF and Opera and IE7 show how quickly images become ugly at just a few enlargements. But, this might still be ok, if one doesn't mind the ugliness. In which case, in an example by Paul O'B, he took the original image, which was gigantor (like a bazillion pixels by a bazillion pixels), and made the browser smoosh it smaller instead by default (he set the size to like 50% in the HTML), and scaling or stretching the page only let it get bigger (thus, better quality as it neared its true size). But, that means all users downloading the largest possible image, no matter how small their screen.

Most people instead have a single, large image, where there may be a lady on it, but also possibly a background behind her or a gradient, which shows as more space opens up around the lady as users' screen enlarge. This solves the problem of ugly scaling artifacts while also stopping a larger screen from getting bald spots on the web page.

I'm no expert, but I fake one on teh Internets