So I have this basic site called Pursuit Talk( questtalk.neocities.org)
In Between the Google Type as well as the Substack Type there is an unusual user-unfriendly room. Nonetheless it is just noticeable on desktop computer web browser applications as well as out mobile web browser applications. There is no details CSS setup. (See complete CSS code listed below)
My concern: Just how can I make certain that room is made use of as successfully as feasible as well as there is not such a massive space in between both frameworks?
HTML
<< iframe src=" https://docs.google.com/forms/d/e/1FAIpQLScKB_z1KgvVb9YI8TsqxESmbC8ls1vEfvv_9oJMD6O1g6gc3Q/viewform?embedded=true" size=" 100%" elevation=" 790" frameborder=" 0" marginheight=" 0" marginwidth=" 0">> Loading ...< To keep up to day as well as reveal assistance, click 'Subscribe'.
<< iframe src=" https://questtalk.substack.com/embed" size=" 100%" design=" boundary:0" frameborder=" 0" scrolling=" no">
<> .
CSS
body {
background-color: #D 6FFC7;.
shade: # 1B3B3A;.
margin-left: 0;.
margin-right: 0;.
font-family: 'Carrier New', Carrier, monospace;.
font-size: 1.2 em;.
text-align: facility;.
padding-bottom: 12vh;.
line-height: 1.8;.
}
header {
placement: repaired;.
size: 100%;.
background-color: #D 6FFC7;.
margin-left: 0;.
shade: # 1B3B3A;.
font-weight: strong;.
/ * cushioning: 1rem; */.
text-align: facility;.
/ * margin-bottom: 2rem;/ * Include margin */.
}
header h2 {
margin-top: 0;.
}
#language- container {
background-color: #D 6FFC7;.
shade: # 1B3B3A;.
font-family: 'Carrier New', Carrier, monospace;.
text-align: facility;.
margin-left: 0;.
font-style: italic;.
/ * cushioning: 1rem; */.
}
#question- container {
background-color: # 1B3B3A;.
shade: white;.
/ * font-weight: strong; */.
font-size: calc( 2.0 *( 0.75 vh + 0.8 vw));.
/ * cushioning: 2rem; */.
text-align: facility;.
margin-left: 0;.
screen: flex;.
justify-content: facility;.
align-items: facility;.
flex-direction: column;.
elevation: 50vh;.
}
#refresh- btn {
background-color: # 1B3B3A;.
shade: white;.
margin-left: 0;.
font-size: 1em;.
font-weight: strong;.
arrow: tip;.
boundary: none;.
font-family: 'Carrier New', Carrier, monospace;.
}
/ *. arrowhead {
font-size: 2em;.
margin-top: 20px;.
text-align: facility;.
} */.
#about- container {
background-color: #D 6FFC7;.
shade: # 1B3B3A;.
/ * cushioning: 1rem; Include cushioning */.
}
#legal- container {
background-color: #D 6FFC7;.
shade: # 1B3B3A;.
}
footer {
placement: repaired;.
base: 0;.
size: 100%;.
background-color: #D 6FFC7;.
margin-left: 0;.
shade: # 1B3B3A;.
font-style: italic;.
/ * cushioning: 1rem; */.
text-align: facility;.
}
h1, h2, h3, h4, h5, h6 {
font-weight: strong;.
}
p {
margin: 1rem 0;.
line-height: 1.5;.
}
human resources {
boundary: none;.
border-top: 2vh strong # 1B3B3A;.
elevation: 1vh;.
margin: 0;.
}
{a shade: # 1B3B3A;/ * This establishes the shade of unvisited web links */.
}
a: seen {
shade: # 1B3B3A;/ * This establishes the shade of seen web links */.
}
a: float {
shade: # 1B3B3A;/ * This establishes the shade of web links when the computer mouse mores than them */.
}
a: energetic {
shade: # 1B3B3A;/ * This establishes the shade of web links when they are clicked */.
}
I made use of << br>> as well as << p>> yet that did not make a distinction in any way on Desktop computer web browsers.
