Web Analytics Made Easy - StatCounter div with text inside a container - CodingForum

Announcement

Collapse
No announcement yet.

div with text inside a container

Collapse
X
Collapse
 
  • Page of 1
  • Filter
  • Time
  • Show
Clear All
new posts
Previous template Next
  • #1

    div with text inside a container

    Hey beautiful people,
    I've got a container with some sprites and classed text in there.
    But as a go to place a text box near my sprites (inside the container) the div doesn't appear, and the text is marginally visible on the top left of the screen behind the container.
    Given that the div and class layout is exactly the same as my text above my sprites.
    Cheers.
    Tags: None
  • #2
    Share link of you page and screenshot how you want it.

    Comment

    • #3
      well, i'm actually just duplicating the google gmail homepage, the one with the drwaers, cirlce and phone sprited in :-)
      https://www.gmail.com

      Comment

      • #4
        Sorry... we cant help u like this..
        Share the code and your challenge in details.... and let us know what you have done yourself....

        Comment

        • #5
          #container {margin:0px auto; height:1000px; width:1200px; background-color:white;}
          #gmaillogo{Position:absolute; margin-top:10px; margin-left:0px; width:143px; height:59px; background-image: url('gmaillogo.png')}
          .header { font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight: normal; position:absolute; margin-top:85px; margin-left:0px}
          .header2 {font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight: normal; position:absolute; margin: 0px 15px; margin-left:28px; margin-top:117px}
          #sprite1 {Position:absolute; margin-top:167px; margin-left:10px; width:43px; height:43px; background-image:url('sprite_mail_hp.png')}
          #sprite2 {Position:absolute; margin-top:208px; margin-left:10px; top:20px; bottom:60px; width:45px; height:45px; background-image:url('sprite_mail_hp.png'); background-position:-125px -40px;}
          #sprite3 { position:absolute; margin-top:263px; margin-left:16px; top:35px; bottom:65px; width:45px; height:40px; background-image: url('sprite_mail_hp.png'); background-position: 120px -125px;} }
          #indiv1 {margin:190px 150px; height:100px; width:200px; background-color:black; z-index:auto}

          here's my css, the bottom div is the div not showing, all the others appear as instructed and called in my html code. So basically i just need to call this out so i can move the div and add text to it.

          Comment

          • #6
            Please share full code including HTML

            Comment

            • #7
              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
              <html xmlns="http://www.w3.org/1999/xhtml">
              <head>
              <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
              <link rel="stylesheet" type="text/css" href="google.css"/>
              <title>Untitled 2</title>
              </head>
              <body>
              <div id="container">
              <div id="gmaillogo"></div>
              <p class=" header">A Google approach to email.</p>
              <p class="header2" style="left: 0px; top: 0px"> Gmail is built on the idea that email can be more intuitive, efficient, and useful. And maybe even fun. After all, Gmail has:</p>

              <div id="sprite1"></div>
              <div id="sprite2"></div>
              <div id="sprite3"></div>
              <div id="indiv1"></div>

              indiv1 is the div not displaying :-)

              Comment

              • #8
                Can you share the mock up of your desired layout .. how it should look like.... dont share any link..

                Please share image only.

                Comment

                • #9
                  its the landing page for gmail, i'm just doing an excercise on css using this as a template, the landing page has a drawer on it, a circle with a cross through it and a phone, with the sign in box to the right.
                  I'm trying to get the div next to the images to place text there (eg. storage etc)

                  Comment

                  Previous template Next
                  Working...
                  X
                  😀
                  🥰
                  🤢
                  😎
                  😡
                  👍
                  👎