The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> IFrame Side By Side HTML Page Code
kane50
post Mar 24 2020, 02:44 PM
Post #1





Group: Members
Posts: 3
Joined: 24-March 20
Member No.: 27,247



Hi

I cannot figure it out, now they are up and down
thanks

<!-- Oil Price Script - OILCRUDEPRICE.COM -->
<div style="width:198px; border:1px solid #2d6ab4;height:auto;background-color:#f0eea6;font-family:Arial;"><div style="background-color:#2d6ab4;height:24px;width:100%; margin:0 auto;font-size:18px; font-weight:bold;text-align:center; padding-top:0px;"><a href="https://www.oilcrudeprice.com/" rel="nofollow" style="color:#ffffff;text-decoration:none;">Wti Oil Price</a></div><script type="text/javascript" src="https://www.oilcrudeprice.com/oilwidget.php?l=en&m=000000&g=f0eea6&c=2d6ab4&i=f2d9d9&l=2d6ab4&o=e6f2fa&u=wti"></script></div>
<!-- End of oil Price Script -->




<!-- Oil Price Script - OILCRUDEPRICE.COM -->
<div style="width:198px; border:1px solid #2d6ab4;height:auto;background-color:#f7b2b2;font-family:Arial;"><div style="background-color:#2d6ab4;height:24px;width:100%; margin:0 auto;font-size:18px; font-weight:bold;text-align:center; padding-top:0px;"><a href="https://www.oilcrudeprice.com/" rel="nofollow" style="color:#ffffff;text-decoration:none;">Natural Gas Price</a></div><script type="text/javascript" src="https://www.oilcrudeprice.com/oilwidget.php?l=en&m=000000&g=f7b2b2&c=2d6ab4&i=f0edc8&l=2d6ab4&o=e6f2fa&u=gas"></script></div>
<!-- End of oil Price Script -->
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 24 2020, 07:55 PM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



Float both main DIVs left.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
kane50
post Mar 25 2020, 06:03 AM
Post #3





Group: Members
Posts: 3
Joined: 24-March 20
Member No.: 27,247



Pandy thanks how do I do that? I am a rookie.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 25 2020, 10:20 AM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



Oh, sorry. Add 'float: left' to the style declartion for each outer DIV.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
kane50
post Mar 25 2020, 02:49 PM
Post #5





Group: Members
Posts: 3
Joined: 24-March 20
Member No.: 27,247



pandy how would the code look
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 25 2020, 03:12 PM
Post #6


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,716
Joined: 9-August 06
Member No.: 6



You have this for the first DIV.

CODE
<div style="width:198px; border:1px solid #2d6ab4;height:auto;background-color:#f0eea6;font-family:Arial;">


The value of the style attribute is CSS.

CODE
width:198px; border:1px solid #2d6ab4;height:auto;background-color:#f0eea6;font-family:Arial;


It contains 5 CSS declarations (for width, border, height, background-color and font-familie) separated with semi-colon.

So you just att the new one to the others.

CODE
<div style="width:198px; border:1px solid #2d6ab4;height:auto;background-color:#f0eea6;font-family:Arial; float: left">


Do the same for the second DIV.

This may or may not be enough, depending on how the rest of the page looks and where you want these DIVs.

And you should go here https://htmlhelp.com/reference/css/ and read it through from start to end. It's just a few page. Try the examples and see for yourself what they do. It's only CCS 1. but that doesn't matter. It's the basic stuff you should lean first and it's still valid.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 28th March 2024 - 08:55 PM