Solved

Easy html problem

Posted on 2009-03-29
22
239 Views
Last Modified: 2012-05-06
I have a problem with my html - somehow the "contens" row is placed right - I want it to be left and it wont work no matter what. Is there somekind of html problem
<html>
 

<head>

<meta http-equiv="Content-Language" content="da">

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>New Page 6</title>

</head>
 

<body>
 

<table border="1" width="100%">

	<tr>

		<td width="860" height="100" valign="top" colspan="4">&nbsp;</td>

	</tr>

	<tr>

		<td width="887" height="27" valign="top">&nbsp;</td>

		<td width="42" height="27" valign="top">&nbsp;</td>

		<td width="41" height="27" valign="top">&nbsp;</td>

		<td width="33" height="27" valign="top">&nbsp;</td>

	</tr>

	<tr>

		<td width="430" height="600" valign="top" colspan="2">&nbsp;</td>

		<td width="430" height="600" valign="top" colspan="2">content</td>

	</tr>

</table>
 

</body>
 

</html>

Open in new window

0
Comment
Question by:rossoneris
  • 6
  • 6
  • 4
  • +2
22 Comments
 
LVL 12

Expert Comment

by:alien109
ID: 24013043
change:

<tr>
    <td width="430" height="600" valign="top" colspan="2"> </td>
    <td width="430" height="600" valign="top" colspan="2">content</td>
</tr>

to

<tr>

    <td width="430" height="600" valign="top" colspan="2">content</td>
    <td width="430" height="600" valign="top" colspan="2"></td>
</tr>


0
 
LVL 4

Expert Comment

by:amazingwolf1
ID: 24013048
Hi
Please re-explain, I see you placed the cell "content" on the right of the page. Switching the two <td> elements will move "Content" cell to the left. Is this what you meant?...
0
 

Author Comment

by:rossoneris
ID: 24013058
I want the cell at the right to be left. But even I resize the width it stays as it now
0
 
LVL 4

Expert Comment

by:amazingwolf1
ID: 24013071
Hi rossoneris,
If I understand you correclty, then you want the cell containing the word 'content" to be swapped with the cell on it's left. If this is the case, then the solution is indeed to swap the code like so:

<td width="430" height="600" valign="top" colspan="2">content</td>
<td width="430" height="600" valign="top" colspan="2">&nbsp;</td>

Otherwise, please repost your code and put in the cells the words "right" and "left" so we can help out.

Thanks
0
 
LVL 6

Expert Comment

by:ITHelper80
ID: 24013075
Are you wanting the contents cell to the left or just the word content?

If you are looking for the entire cell to be moved then alien's solution is correct.

If you wont the word content to be moved then use this.

<td width="430" height="600" valign="top" colspan="2" style="text-align: right">content</td>

If its something else, please explain in more detail.
0
 
LVL 6

Expert Comment

by:ITHelper80
ID: 24013172
Ive been looking at this more and I think I understand your problem.

The problem is with column span the above column widths affect the ones below it. try this code...it should work for you.
<table border="1" width="100%">

	<tr>

		<td width="860" height="100" valign="top" colspan="4">&nbsp;</td>

	</tr>

	<tr>

		<td height="27" valign="top" class="style2">&nbsp;</td>

		<td height="27" valign="top" class="style1">&nbsp;</td>

		<td width="41" height="27" valign="top">&nbsp;</td>

		<td width="33" height="27" valign="top">&nbsp;</td>

	</tr>

	<tr>

		<td height="600" valign="top" colspan="2">content</td>

		<td width="430" height="600" valign="top" colspan="2">&nbsp;</td>

	</tr>

</table>

Open in new window

0
 

Author Comment

by:rossoneris
ID: 24013679
It helper - Yes - the cell must be right as you give in the example- but the 3 columns in the small row must be at the right side
0
 
LVL 12

Expert Comment

by:alien109
ID: 24013720
I'm confused. Are you sure you're not mixing up what are columns and what are rows?

<tr> determines a row in a table
<td> is a cell within that row.

You don't really define columns in html tables.

Please clarify your question. The above html doesn't have 3 columns, but rather 3 rows with 4 columns.
0
 

Author Comment

by:rossoneris
ID: 24013730
Here is what I want - I had made this line in paint
0
 

Author Comment

by:rossoneris
ID: 24013734
here is the photo
error.jpg
0
How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

 
LVL 6

Accepted Solution

by:
ITHelper80 earned 125 total points
ID: 24013805
Ok here you go. Had to create two seperate tables to get what you require.
<html>

 

<head>

<meta http-equiv="Content-Language" content="da">

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>New Page 6</title>

    <style type="text/css">

        .style1

        {

            width: 147px;

            height: 489px;

        }

        .style2

        {

            height: 489px;

        }

    </style>

</head>

 

<body>

 

<table border="1" width="100%">

	<tr>

		<td width="860" height="100" valign="top" colspan="4">&nbsp;</td>

	</tr>

	<tr>

		<td width="887" height="27" valign="top">&nbsp;</td>

		<td width="42" height="27" valign="top">&nbsp;</td>

		<td width="41" height="27" valign="top">&nbsp;</td>

		<td width="33" height="27" valign="top">&nbsp;</td>

</tr>

</table>

 

    <table width="100%" border="1">

        <tr>

            <td class="style1" valign="top">

                Content</td>

            <td class="style2">

                </td>

        </tr>

    </table>

 

</body>

 

</html>

Open in new window

0
 
LVL 12

Expert Comment

by:alien109
ID: 24013815
The first column in the third row, cannot be more narrow than the first column in the row above. All columns must be equal in width.

Try the following, it will acheive mostly what you are looking for

<html>
 

<head>

<meta http-equiv="Content-Language" content="da">

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>New Page 6</title>

</head>
 

<body>
 

<table border="1" width="100%">

        <tr>

                <td height="100" valign="top" colspan="5">&nbsp;</td>

        </tr>

        <tr>

                <td width="30" height="27" valign="top">&nbsp;</td>

                <td width="744" height="27" valign="top">&nbsp;</td>

                <td width="42" height="27" valign="top">&nbsp;</td>

                <td width="41" height="27" valign="top">&nbsp;</td>

                <td width="33" height="27" valign="top">&nbsp;</td>

        </tr>

        <tr>

                <td width="30" height="430" valign="top">&nbsp;</td>

                <td width="860" height="430" valign="top" colspan="4">content</td>

        </tr>

</table>
 

</body>
 

</html>

Open in new window

0
 
LVL 12

Expert Comment

by:alien109
ID: 24013835
Rossineris, you want want to consider using divs rather than tables for layout.
0
 
LVL 6

Expert Comment

by:ITHelper80
ID: 24014334
rossoneris, did my code work for you?
0
 
LVL 13

Expert Comment

by:qwerty021600
ID: 24016001
Try this ... I think this is what you want

<html>
 
<head>
<meta http-equiv="Content-Language" content="da">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 6</title>
</head>
 
<body>
 
<table border="1" width="100%">
        <tr>
                <td height="100" valign="top" colspan="5"> </td>
        </tr>
        <tr>
                <td width="43" height="27" valign="top">  </td>
                <td width="822" height="27" valign="top"> </td>
                <td width="23" valign="top"></td>
                <td width="25" valign="top"></td>
          <td width="26" height="27" valign="top"> </td>
        </tr>
        <tr>
                <td height="600" valign="top">content </td>
                <td height="600" valign="top" colspan="4">&nbsp;</td>
        </tr>
</table>
 
</body>
 
</html>
0
 

Author Comment

by:rossoneris
ID: 24022629
I found the solution
  <table border="0" width="960" height="715" cellspacing="0" cellpadding="0">

    <tr>

      <td colspan="6" width="960" height="155"><div id="altd">

			&nbsp;</div></td>

    </tr>

  <tr>

      <td width="750" height="25" ID="menu" bgcolor="#b71d21">menu</td>

       <td width="20" height="25" bgcolor="#000000"></td>

       <td width="40" height="25" bgcolor="#000000">&nbsp;</td>

      <td width="40" height="25"  bgcolor="#000000">&nbsp;</td>

      <td width="40" height="25" bgcolor="#000000">&nbsp;</td>

      <td width="70" height="25" ID="sp" align="right" bgcolor="#000000">sprog</td>

    </tr>       

          <td width="960" height="535" valign="top" colspan="6">

        <table border="0" width="960" cellspacing="0" cellpadding="0">

          <tr>

            <td width="167" height="535" valign="top" ID="content">content</td>

            <td width="793" height="535" valign="top" background="images/ind.jpg" ID="ind">indmenu</td>

          </tr>

           

  </table>

Open in new window

0
 
LVL 6

Expert Comment

by:ITHelper80
ID: 24022694
No to be anal but you used my solution of having two tables. I think I deserve the points. Its not cool to have people help you and then try to close the question.
0
 
LVL 6

Expert Comment

by:ITHelper80
ID: 24022701
No to be anal but you used my solution of having two tables. I think I deserve the points. Its not cool to have people help you and then try to close the question.
0
 

Author Comment

by:rossoneris
ID: 24081366
I have tried manual to change the size of the html - but than somehow an extra row in the bottom is being create.

Could you please make the example with the size 860 height and 727 width
0
 
LVL 13

Expert Comment

by:qwerty021600
ID: 24084769
<table border="0" width="960" height="715" cellspacing="0" cellpadding="0">
    <tr>
      <td colspan="6" width="960" height="155"><div id="altd">
                         </div></td>
    </tr>
  <tr>
      <td width="750" height="25" ID="menu" bgcolor="#b71d21">menu</td>
       <td width="20" height="25" bgcolor="#000000"></td>
       <td width="40" height="25" bgcolor="#000000"> </td>
      <td width="40" height="25"  bgcolor="#000000"> </td>
      <td width="40" height="25" bgcolor="#000000"> </td>
      <td width="70" height="25" ID="sp" align="right" bgcolor="#000000">sprog</td>
    </tr>      
          <td width="960" height="535" valign="top" colspan="6">
        <table border="0" width="960" cellspacing="0" cellpadding="0">
          <tr>
            <td width="233" height="860" valign="top" ID="content">content</td>
            <td width="727" height="860" valign="top" background="images/ind.jpg" ID="ind">indmenu</td>
          </tr>
           
  </table>
0

Featured Post

How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
How to convert code to a png file 22 101
Help with HTML 7 39
HTML button disabled 11 36
Bootstrap Columns not Side-by-Side 3 16
Someone recently asked me about how to display a progress indicator on a page while an iframe is loading. And I remember when I first came across this myself. It was a bit tricky to get my head around, but really, it's very simple. The most impor…
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…

747 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now