Highlighted

Need help fast. Can't align two responsive elements.

Contributor ,
Oct 16, 2017

Copy link to clipboard

Copied

Good morning,

I'm having issues with a responsive template and can't get my horizontal line or the button to behave like the copy. Would like both to be flush with text on left side of page. I've tried everything I can think of.

Here is the live version I'm working on.

dc advocacy - premier inc.

Create your own custom css style sheet and link it to the page AFTER the link to 6389_main.min.css file

Add the below css selectors to it:

.hero .buttons {

width: 90%;

margin: 0 auto;

max-width: 1000px;

}

.headline hr {

border-top: 5px solid #ffb819;

width: 30%;

float: left;

}

.headline h1 {

clear: both;

}

Then move the <hr> tag from its current position in the code:

<div class="vertical_center">

              <div>

             <hr>

                   </div>

To directly AFTER the opening 'headline' div tag:

<div class="headline">

              <hr>

Views

225

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

Need help fast. Can't align two responsive elements.

Contributor ,
Oct 16, 2017

Copy link to clipboard

Copied

Good morning,

I'm having issues with a responsive template and can't get my horizontal line or the button to behave like the copy. Would like both to be flush with text on left side of page. I've tried everything I can think of.

Here is the live version I'm working on.

dc advocacy - premier inc.

Create your own custom css style sheet and link it to the page AFTER the link to 6389_main.min.css file

Add the below css selectors to it:

.hero .buttons {

width: 90%;

margin: 0 auto;

max-width: 1000px;

}

.headline hr {

border-top: 5px solid #ffb819;

width: 30%;

float: left;

}

.headline h1 {

clear: both;

}

Then move the <hr> tag from its current position in the code:

<div class="vertical_center">

              <div>

             <hr>

                   </div>

To directly AFTER the opening 'headline' div tag:

<div class="headline">

              <hr>

Views

226

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
Oct 16, 2017 0
LEGEND ,
Oct 16, 2017

Copy link to clipboard

Copied

Create your own custom css style sheet and link it to the page AFTER the link to 6389_main.min.css file

Add the below css selectors to it:

.hero .buttons {

width: 90%;

margin: 0 auto;

max-width: 1000px;

}

.headline hr {

border-top: 5px solid #ffb819;

width: 30%;

float: left;

}

.headline h1 {

clear: both;

}

Then move the <hr> tag from its current position in the code:

<div class="vertical_center">

              <div>

             <hr>

                   </div>

To directly AFTER the opening 'headline' div tag:

<div class="headline">

              <hr>

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...
Oct 16, 2017 0
Contributor ,
Oct 16, 2017

Copy link to clipboard

Copied

Thanks so much for your help and your quick response!

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...
Oct 16, 2017 0
Adobe Community Professional ,
Oct 16, 2017

Copy link to clipboard

Copied

Adjust Button margins as required.  Currently, it's centered in the parent container.

.hero .buttons {

    width: 90%;

    margin: 0 auto;

    max-width: 700px;

}

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...
Oct 16, 2017 1
Contributor ,
Oct 16, 2017

Copy link to clipboard

Copied

Thank you Nancy!!

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...
Oct 16, 2017 0