Announcement Announcement Module
Collapse
No announcement yet.
Is there a valid way to do this? Page Title Module
Move Remove Collapse
Search Search Module
Collapse

Advertisement Advertisement Module
Collapse

Featured Images Featured Images Module
Collapse

Mediabistro Creative Sites Mediabistro Creative Sites Module
Collapse
Latest Topics Latest Topics Module
Collapse

  • p.cabral
    Reply to Newspaper advertising strategies, to get clientes.
    p.cabral
    But, if your market, don't use internet too often,
    do you still believe thats the best strategy to get the same people to advertise on a newspaper?

    thanks
    Today, 05:54 PM
  • Designia
    Reply to RGB or HEX values to Pantone?
    Designia
    They have nothing at all that was designed in the Pantones? A pdf or an .eps? Illustrator has a CMYK to Pantone add on filter I got at the Adobe excahnge years ago that didn't work too badly....
    Today, 05:29 PM
  • Designia
    Reply to Newspaper advertising strategies, to get clientes.
    Designia
    Ugh, newspapers are in a brutal nosedive they're never gonna come out of as long as these huge companies keep gobbling them up. No customer or community loyalty. I just had a few reports done comparing...
    Today, 05:25 PM
  • bahmaine
    Reply to Charter Schools Brochure
    bahmaine
    I am going to put the numbers in their own text box because I want to make them standout and they will be much larger than the text. Someone at work commented that it only looks like very accomplishments...
    Today, 05:21 PM
  • p.cabral
    Newspaper advertising strategies, to get clientes.
    p.cabral
    Hi there,
    Iam working on a nacional weekly newspaper,with 67.000 prints a week,and i want to start an advertising strategy,
    to get more clients to advertise on our newspaper.

    ...
    Today, 05:14 PM
Advertisement Advertisement Module
Collapse

Sponsors Sponsors Module
Collapse

X
Conversation Detail Module
Collapse
  • Filter
  • Time
  • Show
Clear All
new posts

  • Is there a valid way to do this?

    Hi folks,

    I haven't done much work on the web so some of my memories of CSS has faded a bit. I downloaded a copy of the css zen garden's exercise to refresh my memory.

    I got everything to work, but one tag does not validate

    Code:
    html {
    overflow-x: hidden
    }
    Is there any way to do this that adheres to the CSS 2.1 specification, or is there another way I can do this to prevent a horizontal scroll bar when an image is larger than the desired width of the window (and thus causes a horizontal scroll bar?)

  • #2
    overflow-x is css 3, it needs to be just overflow: hidden and you need to specify a size of some sort (75% of width or 500px or something)

    it should be in a div, but you could do it in body { not in the html {

    Comment


    • #3
      Thanks for your reply Aestuo

      I tried using the overflow: hidden property originally on the div but it seems to have no effect when I do that to the div itself. For reference:

      Code:
      <div id="extraDiv1"><span></span></div>
      And the CSS applied to it:

      Code:
      div#extraDiv1 {
          margin-left: 5%;
          position: absolute;
          top: 0;
          z-index: -1;
          overflow: hidden;
          background-image:url(images/ss36-hires.jpg);
          background-position: 600px 0px;
          width: 1600px;
          height: 681px;
      
          }
      
      #extraDiv1 span {
          display: none;
          }
      How do I specify a width or height for the CSS 2.1 version of overflow? It doesn't seem to accept any given values.

      Comment


      • #4
        wait, what are you trying to do? backgrounds should never cause scroll bars, and are you testing in ie6 or something else? (i hope something else)

        also, the overflow only affects content not the background of an element; a background image should automatically get cut off based on the size of the element.

        Comment


        • #5
          Originally posted by Aestuo View Post
          wait, what are you trying to do? backgrounds should never cause scroll bars, and are you testing in ie6 or something else? (i hope something else)

          also, the overflow only affects content not the background of an element; a background image should automatically get cut off based on the size of the element.
          I'm trying to reproduce the effect of a giant image (in this case 1600x681) that does not cause the appearance of a horizontal scroll bar, clipping at 100% width (essentially showing as much of the image as possible before causing a scroll bar.)

          Is this possible using just an empty div and span tag? I'm trying to follow the zen garden exercise by not modifying the html document.

          Comment


          • #6
            if you set the image as the background for the page it clips automatically. you just specify the image as the background in the body, and do not specify the width. if you have fixed width elements within the page, they will cause a scroll bar, but doing the background this way, you should have no issue.

            Comment


            • #7
              (also, am i missing something? does everyone do the "Zen Garden Exercise"? - I've heard of the zen garden site before...)

              Comment


              • #8
                Originally posted by Aestuo View Post
                (also, am i missing something? does everyone do the "Zen Garden Exercise"? - I've heard of the zen garden site before...)
                All it is is just downloading the sample html and css file (or supplying your own, same difference) and editing only the css file, you can't touch the html file.

                I guess from your explanation that it can't be done with a div, and essentially can't be done at all with the stylesheet as a whole unless I get rid of that 5&#37; margin (because otherwise everything would get a 5% margin to the left, no?) The 5% margin was not an absolute necessity, I was just experimenting using percentages instead of static numbers.

                Thanks for the help on understanding overflow and its effect (or lack thereof)!

                Edit: Scratch that, I can make it work I just forgot to remove the margin on the container div to achieve the same effect! Thanks again!
                Last edited by Garamond; 05-29-2009, 11:00 PM. Reason: D'oh

                Comment


                • #9
                  specify in the css that the background of the body be the image, not the background of a div. your content can have its margins then, and the image will get as much shown as fits in the browser size.

                  Comment

                  Mediabistro A division of Prometheus Global Media home | site map | advertising/sponsorships | careers | contact us | help courses | browse jobs | freelancers | content | member benefits | reprints & permissions terms of use | privacy policy Copyright © 2015 Mediabistro Inc.
                  Working...
                  X