• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

DIV does not expand all the way as browser windows is resized

Contributor ,
Oct 31, 2020 Oct 31, 2020

Copy link to clipboard

Copied

Hello

Question: Why does the left column (orange) not expand all the way to the right when the browser window is made smaller by either dragging the computer browser window or viewed in a cell phone?

How to fix?
Test site to view code:  http://www.davidshelpsite.com

Views

308

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
community guidelines

correct answers 1 Correct answer

LEGEND , Oct 31, 2020 Oct 31, 2020

You have a redundant curly bracket in your css, directly before the #right_column media query below - marked in red: (Remove it and your right column WILL then be 100% of its parent container)

 

}
Media@mercycity.churchscreen and (max-width: 768px) { /* this stops the div from expanding beyond max-width */

#right_column{
flex-basis: 100%;
}
} /* Must have 2 curly brackets for media screen */

 

 

Votes

Translate

Translate
Contributor ,
Oct 31, 2020 Oct 31, 2020

Copy link to clipboard

Copied

Correction...... Why does the right column (orange) not expand all the way to the right when the browser window is made smaller by either dragging the computer browser window or viewed in a cell phone?

Votes

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
community guidelines
LEGEND ,
Oct 31, 2020 Oct 31, 2020

Copy link to clipboard

Copied

You have a redundant curly bracket in your css, directly before the #right_column media query below - marked in red: (Remove it and your right column WILL then be 100% of its parent container)

 

}
Media@mercycity.churchscreen and (max-width: 768px) { /* this stops the div from expanding beyond max-width */

#right_column{
flex-basis: 100%;
}
} /* Must have 2 curly brackets for media screen */

 

 

Votes

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
community guidelines
Contributor ,
Oct 31, 2020 Oct 31, 2020

Copy link to clipboard

Copied

Thanks

doh.jpg

Votes

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
community guidelines
LEGEND ,
Oct 31, 2020 Oct 31, 2020

Copy link to clipboard

Copied

LATEST

No problem, its part of what happens, regardless of skill level, a tiny oversight, which is not always obvious, can easily be missed.

Votes

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
community guidelines