Hi: My problem here are the style sheets. I don't understand why the output is as in the attached image.?

css/ReadingFile-4.css

#dev-1 {

position: fixed;

top: 60px;

left: 10px;

width: 500px;

height: 200px;

background-color: yellow;

text-color: white;

}

#dev-2 {

position: fixed;

top: 60px;

left: 550px;

width: 500px;

height: 200px;

background-color: red;

text-color: white;

}

#dev-1.#lb1, #dev-1.#lb2, #dev-1.#lb3, #dev-1.#tb1, #dev-1.#tb2, #dev-1.#cities{

position: relative;

width: 150px;

height: 20px;

}

#dev-1.#lb1, #dev-1.#lb2, #dev-1.#lb3 {

position: fixed;

left: 10px;

}

#dev-1.#tb1, #dev-1.#tb2, #dev-1.#cities {

position: fixed;

left: 180px;

}

#dev-1.#tb1, #dev-1.#lb1 {

position: fixed;

top: 70 px;

}

#dev-1.#tb2, #dev-1.#lb2 {

position: fixed;

top: 100 px;

}

#dev-1.#cities, #dev-1.#lb3 {

position: fixed;

top: 130 px;

}

Update:

Problem:

I created 2 rectangles. In the left rectangle I placed 6 controls.

Idea with respect to the controls was:

Alls controls have the same size (height and width).

the labels (#lb1, #lb2, #lb3 share the left coordinates,

The input controls #tb1, #tb2, and #cities the left coordinates, left of the respective labels and finally

#lb1, #tb1, #lb2, #tb2, and #lb3, #cities share the top control. Please help and thank you for your attention. 

Update 2:

one more: width and height for all controls are the same. Thank you, again

Update 3:

main module

<!doctype html>

<html lang="en">

  <head>

  <meta charset="UTF-8">

    <link rel="stylesheet" href= "css/ReadingFile-4.css" type = "text/css"/>

    <title>A Title</title>

  </head>

  <body>

    <div id="dev-1" >

      <?php include "include/phpFunctionDefs.php";?>

      <form method="get" id="f1">

        <?php include "include/phpFunctionCalls.php";?>

      </form>

    </div>

    <div id="dev-2">

      <form method="get" id = "f2">

      </form>

    </div>

  </body>

  </html>

Update 4:

Please try this; include files and data files are in comments and because they are missing from the main module, there are a terrible number of warnings/errors. For further information: Working IDE: codelite. Three week ago I installed wamp64 with php and apache. I hope this helps you to answer my question. Thank you.

https://ideone.com/MQVEv4

Attachment image

2 Answers

Relevance
  • 10 months ago

    I still don't have an answer, but I want to avoid that the request of the "cartoon cat" gets the best answer! Getting some code, where the setup would be like this cannot be expected. How can an answer be expected, which would make sense. Sorry, I really feel that my question is silly, but I just don't know how else to handle it. Thank you.

    <html>

    <head>

    <title>some title</title>

    <style>

    <!-- here the style sheet I provided in my question-->

    </style>

    </head>

    <body>

    <label id='lb1'>lb1</label>

    <label id='tb2'>tb2</label>

    <label id='lb2'>lb2</label>

    <label id='tb2'>tb2</label>

    <label id='lb3'>lb3</label>

    <label id='cities'>cities</label>

    </body>

    </html>

    Sorry for that, but kindly somebody come up with an answer, it would be appreciated. Thank you.

  • Lv 7
    10 months ago

    well, you didn't paste your web (PHP) code so i cannot give a very good answer.

    did you use DIVs for the sections or SPANs? DIVs are best if you want each control on its own line. SPAN is best for inline controls.

    i'm also not sure what you are expecting to happen. everything is working according to CSS code. can you explain what you want?

    sometimes you can see better what is happening with an object if you right-click it and click Inspect. if the code is not updating in browser, you should clear the cache.

Still have questions? Get answers by asking now.