www.webdeveloper.com
Results 1 to 2 of 2

Thread: Table of Images with text on them?

  1. #1
    Join Date
    Jul 2013
    Posts
    2

    Question Table of Images with text on them?

    Hello, Recently I started learning html, css & jquery, but right now I'm stuck on something that might seem very simple to someone.
    I'm trying to make 4 buttons in a row with text on them and a line below them.

    Thank you very much.

    - Alex.


    My css
    Code:
    .kool1 img, .kool2 img, .kool3 img, .log img{
        cursor:pointer;
        float:left;
        top:10px;
    	margin:1px;
        height:50px;
        width:100px;
    
        position:absolute;
    	   }
    	   
    	   .kool1 #tkool1, .kool2 #tkool2, .kool3 #tkool3, .log #tlog{
    	   font-size:10px;
    	   font-family:Tahoma, Geneva, sans-serif;
    	   font-weight:600;
    	   top:10px;
    	   left:25px;
    	   position:relative;
    	   
    	  }

    html
    Code:
    <!DOCTYPE html >
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>Dynama </title>
    		
    		<link href="./css/style.css" rel="stylesheet" type="text/css">
    
        </head>
    
    	
    	
    <body>
    
    
    
    <div class="wrapper">
    
    <div class="kool1">
     <img alt="" src="./images/button_left.png" />
      <div id="tkool1">
        <p>kool 1</p>
      </div>
    </div>
    
    <div class="kool2">
     <img alt="" src="./images/button_left.png" />
      <div id="tkool2">
        <p>kool 1</p>
      </div>
    </div>
    
    <div class="kool3">
      <img alt="" src="./images/button_left.png" />
      <div id="tkool3">
        <p>kool 3</p>
      </div>
    </div>
    
    <div class="log">
      <img alt="" src="./images/button_left.png" />
      <div id="tlog">
        <p>Log out</p>
      </div>
    </div>
    
    </div>
    
    
    
    
    
    
    
    </body>
    
    
    </html>

  2. #2
    Join Date
    Jul 2013
    Posts
    2
    my css*
    Code:
       #logo {
    	width:167px;
        height:96px;
        margin-right: 200px;
        float:left;
    	margin: 24px;
       }
       
         #wrapper { 
        float: left; 
        width: 500px; 
    	   
        background-repeat:no-repeat;
    	margin-top:47px;
    	 
          
    	   font-family:Tahoma, Geneva, sans-serif;
    	font-size:12px;
    	
       }
       
       .kool1 img, .kool2 img, .kool3 img, .log img{
        cursor:pointer;
        float:left;
        top:10px;
    	margin:1px;
        height:50px;
        width:100px;
    
        position:absolute;
    	   }
    	   
    	   .kool1 #tkool1, .kool2 #tkool2, .kool3 #tkool3, .log #tlog{
    	   font-size:10px;
    	   font-family:Tahoma, Geneva, sans-serif;
    	   font-weight:600;
    	   top:10px;
    	   left:25px;
    	   position:relative;
    	   
    	  }
    PS.
    I'm sorry for my awful English.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles