Highlighted

Align [widget] script results

New Here ,
Mar 08, 2020

Copy link to clipboard

Copied

I am realitvley new to Dreamweaver and I am trying to aligh a script that is a wether widget. The script returns the correct infomration, but I cannot seem to get it to alight in the body. I want to align it to the left side, but I am having no luck. What is the trick to alight the results? Thanks in advance for your help. 

 

THIS IS WHAT I HAVE....I removed the <div alignemt = "left"> so this is it with nothing around it trying to aligh it. This is code from a template page that I have at this time. I have not made any other modificatinos to it. 

 

<hgroup>
<h3>Header Content Region</h3>
<h4>Insert text, image or banner ads here, or just delete this text and leave this area blank!</h4>
</hgroup>
<script type='text/javascript' src='https://darksky.net/widget/default/35.1976,-79.4625/us12/en.js?width=200%&height=160&title=28374&tex... New Roman&customFont=&units=us&htColor=333333&ltColor=C7C7C7&displaySum=yes&displayHeader=yes'></script>

TOPICS
Code

Views

268

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Align [widget] script results

New Here ,
Mar 08, 2020

Copy link to clipboard

Copied

I am realitvley new to Dreamweaver and I am trying to aligh a script that is a wether widget. The script returns the correct infomration, but I cannot seem to get it to alight in the body. I want to align it to the left side, but I am having no luck. What is the trick to alight the results? Thanks in advance for your help. 

 

THIS IS WHAT I HAVE....I removed the <div alignemt = "left"> so this is it with nothing around it trying to aligh it. This is code from a template page that I have at this time. I have not made any other modificatinos to it. 

 

<hgroup>
<h3>Header Content Region</h3>
<h4>Insert text, image or banner ads here, or just delete this text and leave this area blank!</h4>
</hgroup>
<script type='text/javascript' src='https://darksky.net/widget/default/35.1976,-79.4625/us12/en.js?width=200%&height=160&title=28374&tex... New Roman&customFont=&units=us&htColor=333333&ltColor=C7C7C7&displaySum=yes&displayHeader=yes'></script>

TOPICS
Code

Views

269

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Mar 08, 2020 0
Adobe Community Professional ,
Mar 08, 2020

Copy link to clipboard

Copied

Dreamweaver is a tool to help you create websites. The question that you are asking is not a Dreamweaver question, but one that you should be asking Dark Sky. To help you on your way, please go to https://darksky.net/help/website


Ben

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 08, 2020 0
Adobe Community Professional ,
Mar 08, 2020

Copy link to clipboard

Copied

This widget is NOT responsive so I cannot recommend it in production. 

 

That said, use some CSS positioning.  I'm using inline styles here for expediency.  Normally you would add CSS to your custom stylesheet.

 

<div id="widget-wrapper" style="position:relative">
<div id="dark-sky-widget" style="position:absolute; top:10px; left:0">

<script type='text/javascript' src='https://darksky.net/widget/default/35.1976,-79.4625/us12/en.js?width=200%&height=160&title=28374&tex... New Roman&customFont=&units=us&htColor=333333&ltColor=C7C7C7&displaySum=yes&displayHeader=yes'></script>

</div>
</div>

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 08, 2020 1
New Here ,
Mar 08, 2020

Copy link to clipboard

Copied

Thanbk you both for the responses. Just so I am clear for my own learning- what would I put in the CSSheet? Just trying to learn. 

 

 

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 08, 2020 0
Adobe Community Professional ,
Mar 08, 2020

Copy link to clipboard

Copied

In CSS, unique IDs are prefixed with a hash tag #. 

 

#widget-wrapper {position:relative}

#dark-sky-widget {position:absolute; top:10px; left:0}

 

Nancy O'Shea, ACP
Alt-Web Design & Publishing

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 08, 2020 0