Archived topic
CSS Formatting For Header Sections - Unequal Widths
3 replies · Started by Mary Pearson on January 27, 2020
Can you please tell me the correct way to format three unequal header sections. I know they need to add up to 100% but I just can't figure out how based on the following from documentation.
.header-section > div {
width: 33.33333%;
}
Many thanks
Hi Mary,
If you are using the same HTML here:
https://docs.generatepress.com/article/split-header-three-sections/
Then you would replace this part of the CSS:
.header-section > div {
width: 33.33333%;
}
With this:
.header-section .header-section-1 {
width: 20%
}
.header-section .header-section-2 {
width: 60%
}
.header-section .header-section-3 {
width: 20%
}
Let me know if this helps :)
Thank you so much Leo!!!!
No problem :)