Jump to content

CSS adjacent sibling "+" combinator, etc.


Recommended Posts

Attention: w3schools.com forum members:

     The code for one of my web pages is shown below:

<html>
   <head>
      <meta content = "text/html; charset=ISO-8859-1" http-equiv = "content-type">
      
      <!-- Adapted and edited by Russell E. Willis as of 12/28/18. -->
      <!-- See additional comments below. -->
      
<style>
div.container {
    width: 100%;
    border: 1px solid gray;
}

article {
  @media only screen and (max-width: 35%) {
    body {
    margin-left: 35%;
    border-left: 1px solid gray;
    padding: 0em;
    overflow: hidden;
          }
    }
}
sup {
  vertical-align: super;
  font-size: x-small;
}

p1 {
   text-indent: 1px;
}

.text1 {
  margin: 15px;
}

.content-box {
  column-count: 2;
  -webkit-column-rule: 1px double purple;
  -moz-column-rule: 1px double purple;
  column-rule: 1px double purple;
  margin: 15px;
}
blockquote {
  margin-top: -0.21em;
  margin-bottom: 15px;
  margin-left: 15px;
  margin-right: 15px;
}
/* .table1 {
    width: 100px;
    margin: auto;
    font-size: 14px;
    border: none;
    border-collapse: collapse;
 }
 .table1 th {
    color: #white;
    vertical-align: middle;
    text-align: center;
    border: none;
 }
 .table1 td {
    color: black;
    background-color: white;
    vertical-align: middle;
    text-align: center;
    border: none;
 }
 .table1 tr:nth_child(1) {
    background-color: white;
    vertical-align: middle;
    text-align: center;
    border: none;
} */
div + table {
  font-family: Georgia;
  border-collapse: collapse;
  width: 90%;
}
td, th {
  border: 1px solid black;
  text-align: center;
  padding: 8px;
}
tr:nth-child(even) {
  background-color: #dddddd;
}
/*  */
/* table1 {
 font-family: Georgia;
 border-collapse: collapse;
 width: auto; 
}
td1, th1 {
border: none;
text-align: center;
padding: 8px;
}
tr1 {
background-color: white;
} */
</style> 

<div class="container">

<!-- The following HTML code was adapted and edited from an example located -->
<!-- at the following web site: "https://www.tutorialspoint.com/json/json_ajax_example.htm." -->
		
      <script type = "application/javascript">
         function loadJSON() {
            var data_file = "mydata_2_11-07-2020.json";
            var http_request = new XMLHttpRequest();
            try{
               // Opera 8.0+, Firefox, Chrome, Safari
               http_request = new XMLHttpRequest();
            }catch (e) {
               // Internet Explorer Browsers
               try{
                  http_request = new ActiveXObject("Msxml2.XMLHTTP");
					
               }catch (e) {
				
                  try{
                     http_request = new ActiveXObject("Microsoft.XMLHTTP");
                  }catch (e) {
                     // Something went wrong
                     alert("Your browser broke!");
                     return false;
                  }
					
               }
            }
			
            http_request.onreadystatechange = function() {
			
               if (http_request.readyState == 4  ) {
                  // Javascript function JSON.parse to parse JSON data
                  var jsonObj = JSON.parse(http_request.responseText);

                  // jsonObj variable now contains the data structure and can
                  // be accessed as jsonObj.name and jsonObj.country.
            
                  document.getElementById("Book").innerHTML = jsonObj.book;
                  document.getElementById("Chapter").innerHTML = jsonObj.chapter;
                  document.getElementById("Verse").innerHTML = jsonObj.verse;
               }
            }
			
            http_request.open("GET", data_file, true);
            http_request.send();
         }
		
      </script>
      
  <title>The Holy Bible.</title>
  </head>
	
   <body>
       
      <h3>&#160&#160&#160Please click the "&#x200A;Bible Verses&#x200A;" button below
      to read Bible verses ( <i>ESV</i> ), and read the article also:</h3>
 <!-- Begin: New div section as of 11/08/20. -->
<div> 

<!-- Previously "<table align='center' class='src'>" -->     
      <table align="center" class="table1 src">
         <tr>
           <th><ins>Book</ins></th>
           <th><ins>Chapter</ins></th>
           <th><ins>Verses</ins></th>
         </tr>
         <tr>
           <td><div id = "Book">Mark</div></td>
           <td><div id = "Chapter">10</div></td>
           <td><div id = "Verse">46-52</div></td>
         </tr>
      </table>

      <center><div class = "central">
         <button type = "button" onclick = "loadJSON()">Bible Verses</button>
      </div></center>
<br>
 <!-- End adapted and edited HTML code section. --> 
<center><ins>T<font size="2" color="black">HE</font> H<font size="2" color="black">OLY</font>
B<font size="2" color="black">IBLE</font>: E<font size="2" color="black">NGLISH</font>
S<font size="2" color="black">TANDARD</font> V<font size="2" color="black">ERSION.</font></ins></center><br>		

<center><img src="Holy_Bible_ESV_6_crop (635x640).jpg" height="300" width="300"></center><br> 
<center><b>"&VeryThinSpace;<ins>Lord, let our eyes be opened.</ins>&VeryThinSpace;"</b></center>
<article>
<p align="justify" class="content-box">&#160&#160&#160In Matthew 20:29-34, it is
written, "&VeryThinSpace;<sup><b>29</b></sup>&VeryThinSpace;<sup><i>n</i></sup>&VeryThinSpace;And
as they went out of Jericho, a great crowd followed him.  &nbsp;<sup><b>30</b></sup>&VeryThinSpace;And
behold, there were two blind men sitting by the roadside, and when they had heard
that Jesus was passing by, they cried out, '&VeryThinSpace;Lord,<sup><i>3</i></sup>
have mercy on us, <sup><i>o</i></sup>&VeryThinSpace;Son of David!&VeryThinSpace;'  &nbsp;<sup><b>31</b></sup>&VeryThinSpace;The
crowd <sup><i>p</i></sup>&VeryThinSpace;rebuked them, telling them to be silent,
but they cried out all the more, '&VeryThinSpace;Lord, have mercy on us, Son of
David!&VeryThinSpace;'  &nbsp;<sup><b>32</b></sup>&VeryThinSpace;And stopping, Jesus
called them and said, '&VeryThinSpace;What do you want me to do for you?&VeryThinSpace;'  &nbsp;<sup><b>33</b></sup>&VeryThinSpace;They
said to him, '&VeryThinSpace;Lord, let our eyes be opened.&VeryThinSpace;'  &nbsp;<sup><b>34</b></sup>&VeryThinSpace;And
Jesus in pity touched their eyes, and immediately they recovered their sight and
followed him.&VeryThinSpace;"  &nbsp;To begin with, in order for the two blind men
to follow Jesus, they first had to be able to see Him.  &nbsp;In 15:13, 14, it is
written ( please read this entire chapter to get the immediate context ), "&VeryThinSpace;<sup><b>13</b></sup>&VeryThinSpace;He
answered, <sup><i>t</i></sup>&VeryThinSpace;'&VeryThinSpace;Every plant that my
heavenly Father has not planted <sup><i>u</i></sup>&VeryThinSpace;will be rooted
up.  &nbsp;<sup><b>14</b></sup>&VeryThinSpace;Let them alone; <sup><i>v</i></sup>&VeryThinSpace;they
are blind guides.<sup><i>3</i></sup>  &nbsp;And <sup><i>w</i></sup>&VeryThinSpace;if
the blind lead the blind, both will fall into a pit.&VeryThinSpace;'"  &nbsp;Jesus
( see 15:1 ) said that those who are spiritually blind, and their spiritually blind
followers, will fall into a pit.  &nbsp;Moreover, in 2 Corinthians 4:3, 4, it is
written, "&VeryThinSpace;<sup><b>3</b></sup>&VeryThinSpace;And even <sup><i>d</i></sup>&VeryThinSpace;if
our gospel is veiled, <sup><i>e</i></sup>&VeryThinSpace;it is veiled only to <sup><i>f</i></sup>&VeryThinSpace;those
who are perishing.  &nbsp;<sup><b>4</b></sup>&VeryThinSpace;In their case <sup><i>g</i></sup>&VeryThinSpace;the
god of this world <sup><i>d</i></sup>&VeryThinSpace;has blinded the minds of the
unbelievers, to keep them from seeing <sup><i>h</i></sup>&VeryThinSpace;the light
of <sup><i>i</i></sup>&VeryThinSpace;the gospel of the glory of Christ, <sup><i>j</i></sup>&VeryThinSpace;who
is the image of God.&VeryThinSpace;"  &nbsp;The god of this world is Satan ( see
Luke 10:18 and John 12:31, for example ).  &nbsp;Sinners ( see Matthew 26:36-46
( especially verse 45, for example ), for example ) are blinded by Satan from seeing
the light of the gospel of the glory of Christ, but the Bible also teaches that
it is possible to escape from the snare of the devil.  &nbsp;In 2 Timothy 2:24-26,
it is written, "&VeryThinSpace;<sup><b>24</b></sup>&VeryThinSpace;And <sup><i>r</i></sup>&VeryThinSpace;the
Lord's servant<sup><i>4</i></sup> must not be quarrelsome but <sup><i>s</i></sup>&VeryThinSpace;kind
to everyone, <sup><i>t</i></sup>&VeryThinSpace;able to teach, patiently enduring
evil, <sup><b>25</b></sup>&VeryThinSpace;correcting his opponents <sup><i>u</i></sup>&VeryThinSpace;with
gentleness.  &nbsp;God <sup><i>v</i></sup>&VeryThinSpace;may perhaps grant them
repentance <sup><i>w</i></sup>&VeryThinSpace;leading to a knowledge of the truth,
<sup><b>26</b></sup>&VeryThinSpace;and they may come to their senses and escape
from <sup><i>x</i></sup>&VeryThinSpace;the snare of the devil, after being captured
by him to do his will.&VeryThinSpace;"  &nbsp;Correcting opponents with gentleness
from the Holy Bible ( see Psalm 119:65-73, 142, and 151; John 17:1, 3, and 17; Romans
15:1-4 ( especially verse 4, for example ); and 2 Timothy 2:15; 3:16, 17, for example
) is a critical factor leading to this result.  &nbsp;Once someone is Scripturally
baptized, his or her conscience has been purified from dead works, for example,
for in Hebrews 9:13, 14, it is written, "&VeryThinSpace;<sup><b>13</b></sup>&VeryThinSpace;For
if <sup><i>o</i></sup>&VeryThinSpace;the blood of goats and bulls, and the sprinkling
of defiled persons with <sup><i>p</i></sup>&VeryThinSpace;the ashes of a heifer,
sanctify<sup><i>6</i></sup> for the purification of the flesh, <sup><b>14</b></sup>&VeryThinSpace;how
much more will <sup><i>q</i></sup>&VeryThinSpace;the blood of Christ, who through
the eternal Spirit <sup><i>r</i></sup>&VeryThinSpace;offered himself without blemish
to God, <sup><i>s</i></sup>&VeryThinSpace;purify our<sup><i>7</i></sup> conscience
<sup><i>t</i></sup>&VeryThinSpace;from dead works <sup><i>u</i></sup>&VeryThinSpace;to
serve the living God.&VeryThinSpace;"  &nbsp;One comes in contact with the blood
of Christ through Scriptural baptism ( see also Romans, chapter 6 ( especially verses
3, 4, and 22, for example ) and Colossians, chapter 1 ( especially verse 20, for
example ), for example ).  &nbsp;Moreover, in Hebrews 10:1, it is written, "&VeryThinSpace;<b>10</b>&thinsp;For
since the law has but <sup><i>v</i></sup>&VeryThinSpace;a shadow <sup><i>w</i></sup>&VeryThinSpace;of
the good things to come instead of the true form of these realities, <sup><i>x</i></sup>&VeryThinSpace;it
can never, by the same sacrifices that are continually offered every year, make
perfect those who draw near.&VeryThinSpace;"  &nbsp;This concept of the shadow of
the law of Moses verses the true form of these realities is demonstrated in Table
1, below:<br>
</article>
<br>
<center><caption><ins>Table 1.</ins>:[&thinsp;The shadow of the law of Moses v. The
true form of these realities.&thinsp;]</caption></center><br><br>
</div>

<table align="center">
   <tr>
     <th>The Shadow Of The Law Of Moses.</th>
     <th>Old Testament Passage.</th>
     <th>The True Form Of These Realities.</th>
     <th>New Testament Passage(s).</th>
   </tr>
   <tr>
     <td>Blood of the Sacrifice thrown on people.</td>
     <td>Exodus 24:1-8.</td>
     <td>Sprinkling with the blood of Jesus Christ.</td>
     <td>1 Peter 1:1, 2, for example.</td>
   </tr>  
   <tr>
     <td>The Garments of the Priests.</td>
     <td>Exodus, chapter 28.</td>
     <td>Clothed with Christ.</td>
     <td>Galatians 3:26, 27; Luke 24:49; and Romans 13:14, for example.</td>
   </tr>
</table><br>   
     
<article>
<p align="justify" class="content-box">It amazes me that, in this New Testament
era, we still see men wearing Old Testament garb and sprinkling water on the congregants.  &nbsp;The
shadow of the law of Moses became obsolete when Jesus Christ died on the cross of
Calvary ( see Luke 23:26-49 ( especially verse 33, for example; <i>KJV,</i> for
example ) and Colossians, chapter 2 ( especially verse 14, for example ), for example
), though we can still learn from the Old Testament ( see Galatians 4:30 ( <i>CJB,</i>
for example ), for example ).  &nbsp;This means that we are no longer required to
wear Old Testament clothing, for example.  &nbsp;It also means that we, as full-time
evangelists ( see 2 Timothy 4:1, 2, for example ), are not required to throw blood,
for example, on anyone.  &nbsp;In 1 Peter 1:1, 2, it is written, "&VeryThinSpace;<b>1</b>&thinsp;Peter,
an apostle of Jesus Christ, to those who are elect exiles of <sup><i>a</i></sup>&VeryThinSpace;the
dispersion in Pontus, Galatia, Cappadocia, Asia, and Bithynia, <sup><b>2</b></sup>&VeryThinSpace;according
to <sup><i>b</i></sup>&VeryThinSpace;the foreknowledge of God the Father, <sup><i>c</i></sup>&VeryThinSpace;in
the sanctification of the Spirit, for obedience to Jesus Christ and <sup><i>d</i></sup>&VeryThinSpace;for
sprinkling with his blood: May <sup><i>e</i></sup>&VeryThinSpace;grace and <sup><i>f</i></sup>&VeryThinSpace;peace
be multiplied to you.&VeryThinSpace;"  &nbsp;The sprinkling that takes place when
someone is Scripturally baptized is figurative in nature.  &nbsp;The blood that
Jesus Christ shed on the cross of Calvary is figuratively sprinkled on the one who
is Scripturally baptized.  &nbsp;In the two examples of the shadow of the law of
Moses, as shown in Table 1, above, the shadows became obsolete, but the general
concept associated with each shadow is carried forward into the New Testament, and
applies to us today, as Christians ( see Acts, chapter 11 ( especially verse 26,
for example ), for example ).  &nbsp;It is alarming that those who continue to follow
the various shadows of the law of Moses, for example, today are considered to be
Bible scholars.  &nbsp;What criteria are being used to determine such a noble standing
in society?  &nbsp;It is obvious that the ones who are misapplying the Scriptures
are not spending nearly enough time studying the Holy Bible.  &nbsp;In 2 Timothy 2:15,
it is written, "&VeryThinSpace;<sup><b>15</b></sup>&VeryThinSpace;Do your best to
present youself to God as one approved,<sup><i>2</i></sup> a worker <sup><i>b</i></sup>&VeryThinSpace;who
has no need to be ashamed, rightly handling the word of truth.&VeryThinSpace;"  &nbsp;God
commands ( see Ecclesiastes 12:13, for example ) daily Bible study, for in Acts
17:10, 11, it is written, "&VeryThinSpace;<sup><b>10</b></sup>&VeryThinSpace;<sup><i>v</i></sup>&VeryThinSpace;The
brothers<sup><i>2</i></sup> immediately sent Paul and Silas away by night to Berea,
and when they arrived they <sup><i>w</i></sup>&VeryThinSpace;went into the Jewish
synagogue.  &nbsp;<sup><b>11</b></sup>&VeryThinSpace;Now these Jews were more noble
than those in Thessalonica; they received the word with all eagerness, <sup><i>x</i></sup>&VeryThinSpace;examining
the Scriptures daily to see if these things were so.&VeryThinSpace;"  &nbsp;The
notion of a busy evangelist needs to be considered within the proper framework.  &nbsp;Since
God does not recognize women or denominational men as evangelists ( see John, chapter
4 ( especially verses 40-42, for example ); Ephesians 4:25; and 1 Timothy 2:11,
12, for example ), it is clear who He says an evangelist is&VeryThinSpace;&mdash;&VeryThinSpace;a
Christian man, a member of the church of Christ, who preaches and teaches God's
word to a live audience ( see Acts 18:24-28, for example ).  &nbsp;One implication,
in the passage of Scripture just referenced, is that an evangelist does not have
to have an accurate knowledge of everything the Bible teaches at a given time in
his life, but he <ins>is</ins> required to be a member of the church of Christ.  &nbsp;Secondly,
when an evangelist is shown to be wrong about some subject in the Bible, he must
have the humility ( see Proverbs 15:33, for example ) to repent ( see Luke 13:3,
for example ) of his error, and change his preaching and teaching so that it conforms
to what the Bible teaches.  &nbsp;This concept of willingness to yield is taught
in James 3:17 ( <i>NKJV</i>; with center-column references ), namely: "&VeryThinSpace;17&thinsp;But
<sup><i>a</i></sup>&VeryThinSpace;the wisdom that is from above is first pure, then
peaceable, gentle, willing to yield, full of mercy and good fruits, <sup><i>b</i></sup>&VeryThinSpace;without
partiality <sup><i>c</i></sup>&VeryThinSpace;and without hypocrisy.&VeryThinSpace;"  &nbsp;The
fact that religious denominationalism, partisanship, or sectarianism continues to
exist is an indicator of stubborn adherence to false doctrines.  &nbsp;Finally,
God commands a life of simplicity and godly sincerity, for in 2 Corinthians 1:12,
it is written, "&VeryThinSpace;<sup><b>12</b></sup>&VeryThinSpace;For our boast
is this, <sup><i>u</i></sup>&VeryThinSpace;the testimony of our conscience, that
we behaved in the world with simplicty<sup><i>3</i></sup> and <sup><i>v</i></sup>&VeryThinSpace;godly
sincerity, <sup><i>w</i></sup>&VeryThinSpace;not by earthly wisdom but by the grace
of God, and supremely so toward you.&VeryThinSpace;"  &nbsp;Therefore, as evangelists,
may we be busy studying God's word ( see Acts 18:5, for example ), for example,
and not busy with those things that would hinder our spiritual growth ( see 2 Peter
3:18, for example ).  &nbsp;We must strive for honesty and sincerity, and for the
willingness and ability to respond to sinners who, like the two blind men, cry out,
"&VeryThinSpace;Lord, let our eyes be opened.&VeryThinSpace;"  &nbsp;Please study
the Bible.  &#128366</p>
</article>

<!-- &#160&#160&#160&#160&#95&#95&#95&#95&#95<br> -->
<!-- <blockquote align="justify"><font size="2" color="black"><b>1.</b> <i>HOLMAN <b>BIBLE</b> -->
<!-- DICTIONARY,</i> With summary definitions and explanatory articles on every Bible subject; -->
<!-- introductions and teaching outlines for each Bible book; in-depth theological articles; -->
<!-- plus internal maps, charts, illustrations, scale reconstruction drawings, archaeological -->
<!-- photos, and atlas, <b>GENERAL EDITOR:</b> BUTLER, TRENT C., PH.D., HOLMAN BIBLE -->
<!-- PUBLISHERS, NASHVILLE, TENNESSEE, &copy; Copyright 1991 Holman Bible Publishers, -->
<!-- pp. 1441, 1442.</blockquote> -->

<!-- &#160&#160&#160&#160&#95&#95&#95&#95&#95<br> -->
<!-- <p1 align="justify" class="text1"><font size="2" color="black"><b>1.</b>  https://www.archives.gov/exhibits/featured-documents/emancipation-proclamation</font>.</p1><br> -->
<!-- <p1 align="justify" class="text1"><font size="2" color="black"><b>2.</b>  NEW ILLUSTRATED -->
<!-- <b>W<font size="1">EBSTER'S</font> D<font size="1">ICTIONARY</font></b> <i>Including</i> -->
<!-- <b>T<font size="1">HESAURUS</font></b> <i>of</i> <b>S<font size="1">YNONYMS &</font> A<font -->
<!-- size="1">NTONYMS</font></b>, <b>PMC Publishing Company, Inc.</b>, p. 315.</font></p1><br><br> -->
<!-- <p1 align="justify" class="text1"><font size="2" color="black"><b>2.  G<font size="1"
color="black">OD'S</font> W<font size="1" color="black">ORD<sub>&#174</sub></font>
<font size="1" color="black">TRANSLATION</font>: <i>P<font size="1" color="black">RAY</font>
<font size="1" color="black">THE</font> S<font size="1" color="black">CRIPTURES</font>
B<font size="1" color="black">IBLE</font></b>,</i> E<font size="1" color="black">DITOR</font>:
J<font size="1" color="black">OHNSON</font>, K<font size="1" color="black">EVIN</font>,
B<font size="1" color="black">ETHANY</font> H<font size="1" color="black">OUSE</font>
P<font size="1" color="black">UBLISHERS</font>, pp. xv, 1554.</p1><br>
<br> -->
<!-- <p1 align="justify" class="text1"><font size="2" color="black"><b>2.</b>  <i>HOLMAN -->
<!-- <b>BIBLE</b> DICTIONARY,</i> <b>GENERAL EDITOR: </b>BUTLER, TRENT C., PH.D., HOLMAN -->
<!-- BIBLE PUBLISHERS, NASHVILLE, TENNESSEE, &#169 Copyright 1991 Holman Bible Publishers, -->
<!-- p. 723.</font></p1><br><br> -->

</div> 
</body>
		
</html>

Since my last posting, I found a Hypertext Markup Language version 5 ( HTML5 )/Cascading Style Sheets ( CSS ) code example which gives me about 95% of the solution that I am looking for.  Specifically, if I declare a ".table1 { ... }" class ( which is currently commented out in the "<style></style>" section of my web page ), and remove the "div +" ( CSS adjacent sibling combinator ) portion from my CSS "table { ... }" declaration, then this will cause my first table ( i.e., "'Book,' 'Chapter,' 'Verse,' etc. ) to be displayed on my web page with no borders or shading, while my second table is displayed with borders and shading.  However, editing the first line of the code of the first table ( i.e., from "<table align='center' class='src'>" to "<table align='center' class='table1'>" ) has an adverse effect on the output of the ".json" data file ( i.e., "mydata_2_11-07-2020.json" ).  Changing the class in that "<table></table>" code, for the first table, from "src" to "table1" causes the data in the ".json" data file to print in a long, narrow, vertical strip, rather than horizontally ( which is the format that I need ).  There is also a way to assign more than one class to an HTML5 element ( i.e., "<table align='center' class='table1 src'>" ), but I have not been able to get the output of the above-mentioned ".json" data file to print out correctly ( this approach does not appear to work ).  In the meantime, I have reverted back to using the CSS adjacent sibling "+" combinator ( with the ".table1 { ... }" CSS class code commented out ), since this earlier strategy results in my ".json" data file having the correct output format.  Any suggestions regarding how to produce the proper ".json" data file output format using the ".table1 { ... }" CSS class declaration with the two-class "<table></table>" line of code for my first table?  Thank you ( see Colossians 3:15, for example ) for your help.  Keep in touch.

Sincerely in Christ,

Russell E. Willis

P.S. - Please read Proverbs 23:23.

Edited by Rewillis
Link to post
Share on other sites

The W3c god says your html, css is invalid and not to to his standards, so unless you produce valid coding, he says to cast your code out! until properly validated. For who is to say that, this! is the reason you are troubled by failure.

Sayeth W3c the true lord of all things web, please read link https://www.w3.org/standards/webdesign/htmlcss

  • Like 1
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...