- This topic has 2 replies, 2 voices, and was last updated 4 years, 10 months ago by .
Viewing 3 posts - 1 through 3 (of 3 total)
Viewing 3 posts - 1 through 3 (of 3 total)
- You must be logged in to reply to this topic.
Support › Forums › Flex Theme › Blockquote: expanding display width
Tagged: blockquote css
Hello!
I’m wrestling with getting my blockquotes to display the full width of the site (in line with the text). Right now, the blockquote sections are quite narrow when displayed on a desktop screen, and even more so on mobile.
Here’s what it looks like on the desktop:
Here’s the current coding:
blockquote {
display: block;
position: relative;
border: 1px solid #ccc;
border-radius: 6px;
box-shadow: 1px 1px 1px #ccc;
padding-left: 10px;
padding-top: 10px;
padding-bottom: 10px;
padding-right: 10px;
background-color: #FAFFF0;
border-top: 1px solid #ccc;
border-bottom: 3px solid #ccc;
}
Is there something in the .css file that I need to adjust to allow these sections to be full width?
Thanks!
Allan
Try this CSS
blockquote {
background-color: #FAFFF0;
border: 1px solid #ccc;
border-bottom: 3px solid #ccc;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 1px 1px 1px #ccc;
-moz-box-shadow: 1px 1px 1px #ccc;
box-shadow: 1px 1px 1px #ccc;
display: block;
margin: 40px 0;
position: relative;
padding: 10px;
width: 100%;
}
That did it! Thanks very much for your help.
I’m greatly appreciating this theme. It’s done wonders for my sites.