SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Addict
    Join Date
    Feb 2009
    Location
    israel
    Posts
    218
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    ctrl_+ makes text disappear from page

    Hi everyone,
    My code contains an image and text located on that image as follows:
    Code:
    <style type="text/css">
      * {margin:0;padding:0;font-size:2em;} 
      #me {width:780px;margin-left:110px;float:left;display:inline;}
      .myText
       { 
        padding:15px;
        width:550px;  
        margin-left:-580px ;
        float:left;
        display:inline;
       }
    </style>
    </head>
    <body>
      <div id="me"><img src="to_forum.jpg" /></div>
      <div class="myText">
          abc
      </div>
    </body>
    I uploaded this code at: http://avirot.bravehost.com. When the page shows up in my browser i see: "abc".
    If i want to see larger text i click ctrl_+ but then the text disappears ! Any idea why text disappears from my page when i click "ctrl" and "+" imultaneusly ?
    Thanks !

  2. #2
    SitePoint Wizard Blake Tallos's Avatar
    Join Date
    Jun 2008
    Location
    Cuyahoga Falls, Ohio.
    Posts
    1,510
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code CSS:
    margin-left:-580px ;
    Blake Tallos - Software Engineer for Sanctuary
    Software Studio, Inc. C# - Fanatic!
    http://www.sancsoft.com/


  3. #3
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    That's just a text resize and it's being hidden as Blake said by hte negative margin. Why do you even have that margin anyway?
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  4. #4
    SitePoint Addict
    Join Date
    Feb 2009
    Location
    israel
    Posts
    218
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,
    Thanks for your help.
    If I omit "margin-left:-580px;" the text div will be located beneath the image.
    I assigned: "margin-left:-580px" because i wanted my text to be located at a certain location on a background image. I'll try to make it a "background-image". I preferred it that way because i thought this way i get better control.
    Thanks again.

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Hi, I don't even see the "abc" text anymore . What'd you do with it? Also do you realize this
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Index_ver_8</title>
    <!--[if lt IE 7]>
    <script type="text/javascript">
      sfHover = function() 
        {
         var sfEls = document.getElementById("nav").getElementsByTagName("LI");
         for (var i=0; i<sfEls.length; i++) 
          {
           sfEls[i].onmouseover=function() {
           this.className+=" sfhover";
          }
         sfEls[i].onmouseout=function() 
          {
           this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
          }
         }
        }
    if (window.attachEvent) window.attachEvent("onload", sfHover);
    
    </script>
    <![endif]-->
    <style type="text/css" media="all">
    * {
        padding:0;
        margin:0;
        font-family:Verdana, Arial, sans-serif;
    }
    #nav, #nav ul {
        float:left;
        padding: 0;
        margin:0;
        list-style: none;
    }
    #nav {
        float:none;
        width:800px;
        margin:auto;
        font-size:.7em;
    }
    #nav a {
        color:#000;
        font-weight:bold;
        text-decoration:none;
        display: block;
        color:#4f4c4d;
        padding:2px 15px;
    }
    #nav li {
        float: left;
        position:relative;
        border-left:1px solid green;
        color:#b10;
    }
    #nav li li {
        clear:left;
        width:20em;
    }
    #nav li:first-child, #nav li.first {
        border-left:none;
    }
    #nav li ul li {
        border-left:none;
    }
    #nav li ul {
        padding:0;
        position: absolute;
        width: 20em;
        margin-left: -999em;
        left:0;
        top:100&#37;;
    }
    #nav li:hover ul, #nav li.sfhover ul {
        margin-left:0;
    }
    #nav li:hover a, #nav li.sfhover a {
        color:blue;
    }
    #nav li li {
        width: 20em;
    }
    #nav li li a {
        width:20em;
        padding:2px .5em;
    }
    #nav li:hover li a, #nav li.sfhover li a {
        color:#4f4c4d
    }
    #bg_picture {
        background-image: url(http://avirot.bravehost.com/graphix/rounded_corners_p1.jpg);
        width:800px;
        height:600px;
        margin:1px auto 0px auto;
        padding:0px;
        clear:both;
    }
    #nav li:hover ul, #nav li.sfhover ul {
        margin-left:0;
    }
    #nav li ul a:hover {
        color:#c85b77;
    }
    #nav li ul {
        background-color:#e8dab7;
    }
    </style>
    <title>untitled</title>
    </head>
    <body><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    Two doctypes, two page setups there. I realize the host might be doing this though
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  6. #6
    SitePoint Addict
    Join Date
    Feb 2009
    Location
    israel
    Posts
    218
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi RyanReese,
    I'm blessed with your attention
    I did realize it after i had got your assistance and didn't know if what had caused it was the "Free Hosting" or my free perplexity.
    Anyway, I changed "Float:left" to "background-image" and the problem was solved and i learnt another css lesson.
    I remember someone's post (was it you ?) in this forum to someon's question if css was easy to learn with: "very simple". Not for me.
    Luckily there is you and the rest of them Gurus in this forum to push me on.

  7. #7
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    I probably gave a better answer then very simple lol . I remember a thread like that though.

    It is a learning curve but I seem to have a knack for CSS..I picked it up quickly. It just clicks with me.

    Hanging around forums taught me everything I know. Just hang out around here, try to do threads..memorize our advice to certain situations and when the problem is asked again here just mimic the advice .
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  8. #8
    SitePoint Addict
    Join Date
    Feb 2009
    Location
    israel
    Posts
    218
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, I was speaking of the bottom line of that post which was consisted of far more then 2 words and was much more detailed. CSS may not be difficult but for me it was. So far..
    Right now i'm busy building my first CSS site so i can't learn other people's posts. I'd love to do it when i'm done knowing that meanwhile those posts are in good hands..

  9. #9
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    If you are going to be sticking around watching threads I'll try and give a detailed answer so you can understand it (and others).

    Of course if you won't read it then I won't bother to give a detailed answer lol.

    CSS is one of those languages where you can learn the basics, and help others, and sometimes that's good enough, but sometimes you need to learn the more complex stuff.

    Most of the questions asked here (90&#37 are easy threads and are basic CSS concepts. You can definately learn
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  10. #10
    SitePoint Addict
    Join Date
    Feb 2009
    Location
    israel
    Posts
    218
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK, i'll try to be more involved. maybe it'll work. I mean, maybe i can supply someone with a good solution .... I'll give it a try


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •