HTML and Tables.

Discussion in 'Software' started by Spock96, Jun 11, 2012.

  1. Spock96

    Spock96 Major Geek 'Spocky'

    Hey Guys,
    I'm working on my final project for my HTML class. What I have to do is make a personal web site.

    I have it all down except this table:
    It works, just that my descriptions of my pictures, those cells are huge and my text isn't. How could I fix that?
    Thanks,
    Spock96
     
    Spock96, Jun 11, 2012
    #1
  2. GermanOne

    GermanOne Guest

    Just use a style sheet.
    Code:
    <style type="text/css">
  table tr td:first-child { width:20%; }
</style>
    Regards
    GermanOne
     
    GermanOne, Jun 11, 2012
    #2
  3. mjnc

    mjnc MajorGeek

    You can also add a line break in that long description.

    Code:
     <tr>
 <td><b>first guitar-- First Act MG374 Acoustic Steel String Guitar [b]<br>[/b](36-Inch, Blue with Star Graphics)</b></td>
 <td><img src="First Act Acoustic.jpg" alt="First Guitar"></td>
 </tr>
     
    mjnc, Jun 11, 2012
    #3
  4. Spock96

    Spock96 Major Geek 'Spocky'

    Where would I put this in my code?
     
    Spock96, Jun 11, 2012
    #4
  5. GermanOne

    GermanOne Guest

    Usually in the head.

    Small example with your table (slightly changed to show how css work):
    PHP:
    <!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" dir="ltr" lang="en">
      <    head>
        <    meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
        <    title>Test</title>
        <    style type="text/css">
             /*<![CDATA[*/
              table                   { width:100%; font:16px "Times New Roman", Times, serif; border:7px outset black; }
              table th                { font-size:20px; text-decoration:underline; }
              table th, tr, td        { border:1px outset black; }
              table tr td:first-child { width:20%; font-weight:bold; }
             /*]]>*/
            </style>
      </    head>
      <    body>
        <    table>
          <    tr>
            <    th colspan="2">My Guitars.</th>
          </    tr>
          <    tr>
            <    td>My newest addition-- Ibanez V70</td>
            <    td><img src="Ibanez.jpg" alt="Ibanez" /></td>
          </    tr>
          <    tr>
            <    td>My Electric-- First Act ME201</td>
            <    td><img src="ME201.jpg" alt="Electric" /></td>
          </    tr>
          <    tr>
            <    td>first guitar-- First Act MG374 Acoustic Steel String Guitar (36-Inch, Blue with Star Graphics)</td>
            <    td><img src="First Act Acoustic.jpg" alt="First Guitar" /></td>
          </    tr>
        </    table> 
      </    body>
    </    html>
    Regards
    GermanOne
     
    GermanOne, Jun 11, 2012
    #5
  6. Spock96

    Spock96 Major Geek 'Spocky'

    This is my problem,
    Is there a way that I can "break" that into two lines?
    Like this:
     
    Spock96, Jun 13, 2012
    #6
  7. GermanOne

    GermanOne Guest

    Use the <br> tag as mjnc already mentioned.

    Regards
    GermanOne
     
    GermanOne, Jun 13, 2012
    #7
  8. Spock96

    Spock96 Major Geek 'Spocky'

    Oh, ok. Thank you.
     
    Spock96, Jun 13, 2012
    #8

MajorGeeks.Com Menu

Downloads All In One Tweaks \ Android \ Anti-Malware \ Anti-Virus \ Appearance \ Backup \ Browsers \ CD\DVD\Blu-Ray \ Covert Ops \ Drive Utilities \ Drivers \ Graphics \ Internet Tools \ Multimedia \ Networking \ Office Tools \ PC Games \ System Tools \ Mac/Apple/Ipad Downloads

Other News: Top Downloads \ News (Tech) \ Off Base (Other Websites News) \ Way Off Base (Offbeat Stories and Pics)

Social: Facebook \ YouTube \ Twitter \ Tumblr \ Pintrest \ RSS Feeds