<div class='noshop-products-div'><div class='noshop-products' align='center'>
<!-- -------------------- NoShop Item: The Dream Giver Library / The Dream Giver -------------------- -->
<div class='noshop-product '>
<div class=noshop-product-imagebox width=83 style="width:83px;" >
<a href="http://jesper.angelo.net/wordpress/noshop/" /><img class=noshop-product-image width=83 style="width:83px;" src="./wp-content/themes/mingle-theme/parallelus-mingle/assets/images/skins/skin-7/bw/products/dreamgiver/dreamgiver.png" /></a>
</div>
<div class=noshop-product-textbox>
<a href="http://jesper.angelo.net/wordpress/noshop/" /><div class=noshop-product-title>The Dream Giver</div></a>
<div class=noshop-product-desc>
</div>
<div class=noshop-product-subtable>
</div>
</div>
</div>
<!-- -------------------- NoShop Item: The Dream Giver Library / The Dream Giver DVD -------------------- -->
<div class='noshop-product '>
<div class=noshop-product-imagebox width=83 style="width:83px;" >
<a href="http://jesper.angelo.net/wordpress/noshop/" /><img class=noshop-product-image width=83 style="width:83px;" src="./wp-content/themes/mingle-theme/parallelus-mingle/assets/images/skins/skin-7/bw/products/dreamgiver/dreamgiverdvd.png" /></a>
</div>
<div class=noshop-product-textbox>
<a href="http://jesper.angelo.net/wordpress/noshop/" /><div class=noshop-product-title>The Dream Giver DVD</div></a>
<div class=noshop-product-desc>
</div>
<div class=noshop-product-subtable>
</div>
</div>
</div>
<!-- -------------------- NoShop Item: The Dream Giver Library / The Dream Giver CD -------------------- -->
<div class='noshop-product '>
<div class=noshop-product-imagebox width=83 style="width:83px;" >
<a href="http://jesper.angelo.net/wordpress/noshop/" /><img class=noshop-product-image width=83 style="width:83px;" src="./wp-content/themes/mingle-theme/parallelus-mingle/assets/images/skins/skin-7/bw/products/dreamgiver/dreamgivercd.png" /></a>
</div>
<div class=noshop-product-textbox>
<a href="http://jesper.angelo.net/wordpress/noshop/" /><div class=noshop-product-title>The Dream Giver CD</div></a>
<div class=noshop-product-desc>
</div>
<div class=noshop-product-subtable>
</div>
</div>
</div>
<!-- -------------------- NoShop Item: The Dream Giver Library / The Dream Giver Workbook -------------------- -->
<div class='noshop-product '>
<div class=noshop-product-imagebox width=83 style="width:83px;" >
<a href="http://jesper.angelo.net/wordpress/noshop/" /><img class=noshop-product-image width=83 style="width:83px;" src="./wp-content/themes/mingle-theme/parallelus-mingle/assets/images/skins/skin-7/bw/products/dreamgiver/dreamgiverworkbook.png" /></a>
</div>
<div class=noshop-product-textbox>
<a href="http://jesper.angelo.net/wordpress/noshop/" /><div class=noshop-product-title>The Dream Giver Workbook</div></a>
<div class=noshop-product-desc>
</div>
<div class=noshop-product-subtable>
</div>
</div>
</div>
<!-- -------------------- NoShop Item: The Dream Giver Library / The Dream Giver for Teens -------------------- -->
<div class='noshop-product '>
<div class=noshop-product-imagebox width=83 style="width:83px;" >
<a href="http://jesper.angelo.net/wordpress/noshop/" /><img class=noshop-product-image width=83 style="width:83px;" src="./wp-content/themes/mingle-theme/parallelus-mingle/assets/images/skins/skin-7/bw/products/dreamgiver/dreamgiverteens.png" /></a>
</div>
<div class=noshop-product-textbox>
<a href="http://jesper.angelo.net/wordpress/noshop/" /><div class=noshop-product-title>The Dream Giver for Teens</div></a>
<div class=noshop-product-desc>
</div>
<div class=noshop-product-subtable>
</div>
</div>
</div>
<!-- -------------------- NoShop Item: The Dream Giver Library / The Dream Giver for Parents -------------------- -->
<div class='noshop-product last-product'>
<div class=noshop-product-imagebox width=83 style="width:83px;" >
<a href="http://jesper.angelo.net/wordpress/noshop/" /><img class=noshop-product-image width=83 style="width:83px;" src="./wp-content/themes/mingle-theme/parallelus-mingle/assets/images/skins/skin-7/bw/products/dreamgiver/dreamgiverparents.png" /></a>
</div>
<div class=noshop-product-textbox>
<a href="http://jesper.angelo.net/wordpress/noshop/" /><div class=noshop-product-title>The Dream Giver for Parents</div></a>
<div class=noshop-product-desc>
</div>
<div class=noshop-product-subtable>
</div>
</div>
</div>
</div><!--End Products DIV -->
/* No Shop Categories */
.The_Dream_Giver_Library {
background: #cf2426;
background: -moz-linear-gradient(top, #cf2426 0%, #ac1e1f 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cf2426), color-stop(100%,#ac1e1f));
background: -webkit-linear-gradient(top, #cf2426 0%,#ac1e1f 100%);
background: -o-linear-gradient(top, #cf2426 0%,#ac1e1f 100%);
background: -ms-linear-gradient(top, #cf2426 0%,#ac1e1f 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cf2426', endColorstr='#ac1e1f',GradientType=0 );
background: linear-gradient(top, #cf2426 0%,#ac1e1f 100%);
}
/* No Shop Products */
.noshop-category {
color: #fff;
width: 100%;
margin: 0 auto;
margin-bottom: 5px;
text-align: center;
padding-top: 3px;
font-weight: bold;
font-size: 18px;
height: 30px;
-webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .3);
-moz-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .3);
box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .3);
border: 1px solid rgba(0,0,0,0.4);
}
.noshop-products-div {
margin: 0 auto;
text-align: center;
}
.noshop-products {
margin: 0 auto;
height: 190px;
background: #fefefe;
background: -moz-linear-gradient(top, #fefefe 0%, #d3d3d3 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefefe), color-stop(100%,#d3d3d3));
background: -webkit-linear-gradient(top, #fefefe 0%,#d3d3d3 100%);
background: -o-linear-gradient(top, #fefefe 0%,#d3d3d3 100%);
background: -ms-linear-gradient(top, #fefefe 0%,#d3d3d3 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#d3d3d3',GradientType=0 );
background: linear-gradient(top, #fefefe 0%,#d3d3d3 100%);
-webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .3);
-moz-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .3);
box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, .3);
border: 1px solid rgba(0,0,0,0.4);
margin-top: 10px;
display:-moz-inline-stack;
display:inline-block;
text-align: cente;
}
.noshop-product {
display:-moz-inline-stack;
display:inline-block;
width: 115px;
height: 170px;
margin: 10px 0px;
border-right: 1px solid #939598;
}
.last-product {
border-right: none;
}
.noshop-product-imagebox {
margin: 0 auto;
width: 83px;
}
.noshop-product-imagebox img {
height: 115px;
}
.noshop-product-textbox {
text-align: center;
padding: 0px 15px;
}
.noshop-product-textbox a, .noshop-product-textbox a:visited, .noshop-product-textbox a:link {
color: #000;
font-size: 10px;
font-weight: bold;
}
You can force the content of the HTML <div> element stay on the same line by using a little CSS. Use the overflow property, as well as the white-space property set to “nowrap”. In the next example, we use three elements (<div>, <ul>, and <li>) that are floated and have a fixed width.
You can force the content of the HTML <div> element stay on the same line by using a little CSS. Use the overflow property, as well as the white-space property set to “nowrap”. Watch a video course CSS - The Complete Guide (incl. Flexbox, Grid & Sass) Example of forcing the content of the <div> element to stay on the same line: ¶
An HTML <div> (division) is a block-level elementdesigned to not display any HTML elements next to it unless its default behavior is changed. Below are all the different methods of preventing a div from breaking to the next line. Tip Depending on why you want to break a div, also consider a <span> tag.
CSS allows aligning divs side by side in many ways. We’ll discuss some ways that are widely used. The <div>tag is used to define parts of a page or a document. It is used for grouping large sections of HTML elements and styling them with CSS. Three or more different divs can be put side-by-side using CSS.
You simply need this:
.noshop-product {
vertical-align: top
}
There are two reasons for your problem: the default vertical-align
is baseline
, and the text inside the other .noshop-product
s all have two lines of text.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With