|
website tables to CSS
Trying to convert from tables to CSS to make a responsive website.
This should be 4 vertical colums, instead it is 1 verticle column.
Where did I go wrong ??
Thank You
falcon
<style type="text/css">
.lfcol { float:left;width:19.8%;margin-bottom:5px; }
.micol { float:left;width:19.8%;margin-bottom:5px; }
.rmicol { float:right;width:19.8%;margin-bottom:5px; }
.ricol { float:right;width:19.8%;margin-bottom:5px; }</style>
<h2 class="clear">Old Testament</h2>
<!-- left column -->
<dl class=".lfcol"><font size="+2">
<dt> 1 <a href="01_001.htm">Genesis</a></dt>
<dt> 2 <a href="02_001.htm">Exodus</a></dt>
<dt> 3 <a href="03_001.htm">Leviticus</a></dt>
<dt> 4 <a href="04_001.htm">Numbers</a></dt>
<dt> 5 <a href="05_001.htm">Deuteronomy</a></dt>
<dt> 6 <a href="06_001.htm">Joshua</a></dt></dl>
<!-- middle column -->
<dl class=".micol">
<dt> 7 <a href="07_001.htm">Judges</a></dt>
<dt> 8 <a href="08_001.htm">Ruth</a></dt>
<dt> 9 <a href="09_001.htm">1 Samuel</a></dt>
<dt> 10 <a href="10_001.htm">2 Samuel</a></dt>
<dt> 11 <a href="11_001.htm">1 Kings</a></dt>
<dt> 12 <a href="12_001.htm">2 Kings</a></dt></dl>
<!-- right middle column -->
<dl class=".rmicol">
<dt> 13 <a href="13_001.htm">1 Chronicles</a></dt>
<dt> 14 <a href="14_001.htm">2 Chronicles</a></dt>
<dt> 15 <a href="15_001.htm">Ezra</a></dt>
<dt> 16 <a href="16_001.htm">Nehemiah</a></dt>
<dt> 17 <a href="17_001.htm">Esther</a></dt>
<dt> 18 <a href="18_001.htm">Job</a></dt></dl>
<!-- right column -->
<dl class=".ricol">
<dt> 19 <a href="19_001.htm">Psalms</a></dt>
<dt> 20 <a href="20_001.htm">Proverbs</a></dt>
<dt> 21 <a href="21_001.htm">Ecclesiastes</a></dt>
<dt> 22 <a href="22_001.htm">Song of Solomon</a></dt>
<dt> 23 <a href="23_001.htm">Isaiah</a></dt>
<dt> 24 <a href="24_001.htm">Jeremiah</a></dt></dl>
|
|
|
|
|
|
Hello,
I am currently creating a website in the trial mode of squarespace. I had some trouble doing the things I wanted to do just using the squarespace templates, so I resorted to codes. I do not know much about codes and what I have got done so far is from researching online.
Basically what I have so far is an image with 4 icon images on top of it. (in code) I want to make it so when you hover over each of the of the icons a box from the left slides in and has text information regarding that icon. I want it to slide in from the left of the whole page, not just the picture these 4 icons are on. I cannot for the life of me figure this out.
Below is currently what I have done to create a picture with 4 images and some text on top. I have tried for 2 days to figure out where to ad in the overlay/hover "stuff" but it hasn't worked. I was up till 2 am last night trying different things. If someone could help would be greatly appreciated. Hope this all makes sense. P.S. I don't have any code in here for overlay/hover as it was not working. ANd I am using the Moshka template.
<html>
<head>
<style>
.doggrass
{
position: relative;
top: 0;
left: 0;
}
.bathtub
{position: absolute;
top: 190px;
left: 70px;}
.parkaccess
{position: absolute;
top: 190px;
right:70px}
.discounts
{position: absolute;
bottom:290px;
left:70px }
.events
{position: absolute;
bottom:290px;
right: 70px}
.dogpaw1
{position: absolute;
top:20px;
left: 15px}
.dogpaw2
{position: absolute;
top:365px;
left:15px}
.dogpaw3
{position: absolute;
top:500px;
left:15px}
.bottom-left
{position: absolute;
text-align: center;
color: white;
bottom: 275px;
left: 62px}
.top-left
{position: absolute;
color: white;
text-align: center;
top: 235px;
left: 77px;}
.top-right
{position: absolute;
text-align: center;
color: white;
top: 235px;
right: 58px;}
.bottom-right
{position: absolute;
text-align:ceter;
color:white;
bottom: 275px;
right: 74px;}
.top-left2
{position: absolute;
text-align: left;
color:white;
font-family:impact;
top: 20px;
left: 50px;
right:50px }
.top-left3
{position:absolute;
text-align: left;
color: white;
top:95px;
left: 50px}
.bottom-right2
{position:absolute;
text-align: left;
font-family:impact;
color: white;
left:50px;
top:365px;}
.bottom-right3
{position: absolute;
text-align:left;
color:white;
left:50px;
top:395px;}
.bottom-right4
{position:absolute;
text-align:left;
color:white;
font-family:impact;
left:50px;
top:500px}
.bottom-left2
{position:absolute;
text-align:left;
color:white;
left:50px;
top:530px}
</style>
</head>
<body>
<img src="https://static1.squarespace.com/static/5b8f261d5417fc3f4ba18707/t/5b9741d9575d1f202ba0b496/1536639456655/black+dog+3.jpg" width=400px; height=600px class="doggrass">
<img src="https://static1.squarespace.com/static/5b8f261d5417fc3f4ba18707/t/5b96e0140e2e72b75cc40cea/1536614420600/white+bath.png" width=50px; height=50px class="bathtub">
<img src= https://static1.squarespace.com/static/5b8f261d5417fc3f4ba18707/t/5b96dfe68985831b924b15ad/1536614374362/icons8-dog-park-90.png width=50px; height=50px class="parkaccess"/>
<img src=https://static1.squarespace.com/static/5b8f261d5417fc3f4ba18707/t/5b96e01c0ebbe8ed91e62809/1536614428465/white+event.png width=50px; height=50px class="events"/>
<img src=https://static1.squarespace.com/static/5b8f261d5417fc3f4ba18707/t/5b96dffb4ae2373cac59e9ab/1536614395019/icons8-pricing-96.png width=50px ; height=50px class="discounts"/>
<img src=https://static1.squarespace.com/static/5b8f261d5417fc3f4ba18707/t/5b9745d91ae6cfbcdbd3a5ac/1536640473741/icons8-cat-footprint-filled-100.png width=25px; height=25px class="dogpaw1"/>
<img src=https://static1.squarespace.com/static/5b8f261d5417fc3f4ba18707/t/5b9745d91ae6cfbcdbd3a5ac/1536640473741/icons8-cat-footprint-filled-100.png width=25px; height=25px class="dogpaw2"/>
<img src=https://static1.squarespace.com/static/5b8f261d5417fc3f4ba18707/t/5b9745d91ae6cfbcdbd3a5ac/1536640473741/icons8-cat-footprint-filled-100.png width=25px; height=25px class="dogpaw3"/>
<div class="bottom-left"><font size="">Discounts</font></div>
<div class="top-left"><font size="">Baths</font></div>
<div class="top-right"><font size="">Park Access</font></div>
<div class="bottom-right"><font size ="">Events</font></div>
<div class="top-left2"><font size="6">Membership Benefits</font></div>
<div class="top-left3"><font size="4">Hover over icons below for more information</font></div>
<div class="bottom-right2"><font size="6">Park Hours</font></div>
<div class="bottom-right3"><font size="4">Monday-Friday 6AM-10PM</br> Saturday/Sunday 7AM-11PM</font></div>
<div class="bottom-right4"><font size="6">Our Location</font></div>
<div class="bottom-left2"><font size="4">Ridge Road 2210 </br>View Map</font>
</div>
</div>
</body>
</html>
modified 12-Sep-18 3:25am.
|
|
|
|
|
Hi Experts,
Can any one post me the code to bypass MFA and access the site which is launched in AWS server.
TIA
|
|
|
|
|
Sorry, this site does not provide code to order. Especially not code that tries to breach security.
|
|
|
|
|
hello again...
My NA area's website (due to launch next month) has a Meeting Schedule page, navigated to from the MEETINGS link in the main nav bar on the home page: http://www.moonjams.net/BurlCoNA-VII.html. That schedule has Tabs for every day of the week. My idea was to have the Tab open for the particular day of the week it happens to be (i.e., if it's Monday, I wanted the Monday Tab to automatically open when the schedule page is navigated to). Right now...no matter the day of the week...it always opens on 'Sunday'.
Can someone please help w/ this...???...this is the last task I need to have accomplished prior to launching the site (other than populating the various pages).
thanx very much,
Dox
|
|
|
|
|
Help how exactly? We have no idea what your code is doing.
|
|
|
|
|
i have a website designed in php/ajax and im in need of a push to talk button for the voice video chat portion of my site. any ideas?
|
|
|
|
|
I am developing a plugin that creates two pages on installation and assigns them templates. now I want to call one page(template) through a form on the other page(template). I tried some snippets but no response.
here is the form that will call the other page on submit
<form action="">
<input type="text" class="form-control input-lg" placeholder="Movie Name" />
<button class="btn btn-info btn-lg" type="submit">
class="glyphicon glyphicon-search">
</button>
</form>
I don't know how to do it as WordPress is generic and anybody might use this plugin, so if I put the manual link of the page then everybody will be redirected to my page so how can I do it?
|
|
|
|
|
I have a web application that is a knowledge base- I do login - once i am in it
when I get to the part of Upload Files
The windows gets opened - but I can not find that particular window to send the list of files I want to get opened -
1. How can identify that windows with code C# or VB?
2. Do you have a routine to upload a list of files from a particula directory to a web application?
Thank you!
|
|
|
|
|
You need to talk to the owners of the website.
|
|
|
|
|
currently EF do support posting single object (e.g {id: 1, partyCateg: 'Assetts' } )
public IHttpActionResult Post([FromBody] tbl_PartyCateg categs)
{
return Created(categs);
}
What I want is to send array of Objects. tbl_PartyCateg[]
[
{
id: 11,
PartyCateg: "SomeValue1"
},
{
id: 11,
PartyCateg: "SomeValue1"
}
]
When I post above data via postman I got empty categs on server side.
Where I'm Wrong.
|
|
|
|
|
Hi Experts,
Kindly help me preparing a web dashboard where I need to monitor WEB URL of my site.
If WEB URL is not working an email to be triggered & SMS to be send to list of mobile no's
Kindly help me with to prepare this dashboard.
TIA
|
|
|
|
|
I'm trying to use Vaxin Security on Microsoft Server 2016, i am using the SDK and getting an error on installation.
"Cannot verify hashes"
their support say it has to do with my local ssl certificate.
anybody have the same issue?
|
|
|
|
|
I've never seen the product, but local x509 certificate issues are generally related to not having access to a certificate store or, if the application needs access to the private key, access to the key itself.
I'd review the product documentation, make sure which key store the x509 needed to be in, and verify the required permissions for the account running the application.
"Never attribute to malice that which can be explained by stupidity."
- Hanlon's Razor
|
|
|
|
|
Hello everyone,
Is there anyone on the group that is an expert at Bootstrap Admin Dashboards development?
Thanks Networkrail
|
|
|
|
|
I am completely new to web development looking to learn some tags which will be help me in developing a basic page with some content and images , registration form with some basic input details.
|
|
|
|
|
|
So I'm writing my Angular App. Currently I would write a backend to say create a portfolio of pictures. But I might go back and make it to where you just login and do it on the front side. I could see where users, messages should be on the backside.
Just wondering what you think, in terms of designing a modern app, what should go where.
When I did the portfolio on the front side, more customers participated in creating them. Now that I have it on the backend, nobody uses it.
If it ain't broke don't fix it
Discover my world at jkirkerx.com
|
|
|
|
|
i made a beautiful website but not responsive trying my best but stillnot working perfectly.can someone help me in making my website responsive?
|
|
|
|
|
You need to explain more about what is not working.
|
|
|
|
|
i mean some sections are not working responsively.i can send you the file..
|
|
|
|
|
Once again we cannot guess what sections, or exactly what you mean by "not working responsively". I repeat my previous comment: if you want help then you need to provide proper details of your problem.
|
|
|
|
|
i mean section like price-plans section the box are not size uniformly sized when it reachs near to 800 pixels . And the padding in the price-plan sectionb gets also disappeared as i also give the padding from 760px .And the contact section also starts to disappear from 800px. And at 460px it is pushed to left as it can,t be seen..
Start eating Healty today
Premium
399$/ per month
That’s only 13.30$ per meal
1 meal every day
24/7
Access to newest creations
Free delivery
Sign-Up
Pro
149$/per month
That’s only 14.90$ per meal
1 meal 10 days/month
Order 24/7
Access to newest creations
Free delivery
Sign-Up
Starter
19$/ per meal
1 meal
Order from 8 am to 12 pm
Free delivery
Sign-Up
.section-plans{
background-color: #f4f4f4;
}
.section-plans h2{
margin-top: 80px;
}
.plan-box{
background-color: #fff;
border-radius: 5px;
margin-left: 10%;
width:90%;
}
.plan-box div{
padding: 15px;
border-bottom:1px solid #e8e8e8;
box-shadow:0px 1px 2px #f5f2f2;
}
.month{
font-size: 300%;
margin-bottom: 20px;
font-weight: 210%;
color:#e67e22;
}
span{
font-size: 30%;
font-size: 300;
}
.plan-box ul{
list-style: none;
}
.plan-box div:last-child{
border:none;
text-align: center;
}
.plan-box:first-child{
background-color: #fcfcfc;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
now the media quirie
/* Big tablet to 1200px (widths smaller taht the 1140px row) */
@media only screen and (max-width: 1200px) {
.hero-text {
width: 100%;
padding: 0 2%;
}
.row { padding: 0 2%; }
}
/* Small tablet to big tablet: from 768px to 1023px */
@media only screen and (max-width: 1023px) {
body { font-size: 18px; }
section { padding:60px 0px; }
.long-copy {
width: 80%;
margin-left: 10%;
}
.steps-box { margin-top: 10px; }
.steps-box:last-child { margin-top: 10px; }
.works-steps { margin-bottom: 40px; }
.works-step:last-of-type { margin-bottom: 60px; }
.app-screen { width: 40%; }
.steps-box:first-child { text-align: center; }
.icon-small{
width: 17px;
margin-right: 5px;
}
.city-feauture{
font-size: 90%;
}
.plan-box{
width: 100%;
margin-left: 0%;
}
.plan-price{
font-size: 250%;
}
.contact-form{
width: 80%;
}
/* Small phones to small tablets: from 481px to 767px */
@media only screen and (max-width: 767px) {
section {padding: 30px 0;}
body { font-size: 16px; }
.plan-box div{
}
.plan-box{
width:95%;
}
.first{
font-size: 87%;
}
.last{
font-size: 119%;
}
.row,
.hero-text-box {
padding: 0 4%; }
.col {
width: 100%;
}
.main-nav {
display:none;
}
h1 { font-size: 180%; }
h2 { font-size: 10%; }
.long-copy { width: 100%;
margin-left: 0%;
}
/* Small phones: from 0 to 480px */
@media only screen and (max-width: 480px) {
.col {
width: 100%;
margin-bottom: 0 0 4% 0;
margin-right: 10%;
}
.contact-form{
margin-top:40%;
margin-right:100%;
}
}
|
|
|
|
|
You can use CMS which will take care of responsive issues.
|
|
|
|